

<!DOCTYPE html>
<html lang="zh-CN" data-default-color-scheme=auto>



<head>
  <meta charset="UTF-8">
  <link rel="apple-touch-icon" sizes="76x76" href="https://ikkiss.oss-cn-hangzhou.aliyuncs.com/images/myblog/IKKIS_LOGO.png">
  <link rel="icon" href="https://ikkiss.oss-cn-hangzhou.aliyuncs.com/images/myblog/IKKIS_LOGO.png">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0, shrink-to-fit=no">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  
  <meta name="theme-color" content="#2f4154">
  <meta name="author" content="Ikki">
  <meta name="keywords" content="">
  
    <meta name="description" content="umi4+formily">
<meta property="og:type" content="article">
<meta property="og:title" content="umi4+formily">
<meta property="og:url" content="http://81.68.132.127/2022/11/11/formily/umi4+formily/index.html">
<meta property="og:site_name" content="IKKI">
<meta property="og:description" content="umi4+formily">
<meta property="og:locale" content="zh_CN">
<meta property="og:image" content="https://ikkiss.oss-cn-hangzhou.aliyuncs.com/images/myblog/beijing/iTab-l3qv92.jpeg">
<meta property="article:published_time" content="2022-11-11T13:57:05.000Z">
<meta property="article:modified_time" content="2022-11-11T13:59:54.484Z">
<meta property="article:author" content="Ikki">
<meta property="article:tag" content="组件库">
<meta property="article:tag" content="formily">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="https://ikkiss.oss-cn-hangzhou.aliyuncs.com/images/myblog/beijing/iTab-l3qv92.jpeg">
  
  
    <meta name="referrer" content="no-referrer-when-downgrade">
  
  
  <title>umi4+formily - IKKI</title>

  <link  rel="stylesheet" href="https://lib.baomitu.com/twitter-bootstrap/4.6.1/css/bootstrap.min.css" />



  <link  rel="stylesheet" href="https://lib.baomitu.com/github-markdown-css/4.0.0/github-markdown.min.css" />

  <link  rel="stylesheet" href="https://lib.baomitu.com/hint.css/2.7.0/hint.min.css" />

  <link  rel="stylesheet" href="https://lib.baomitu.com/fancybox/3.5.7/jquery.fancybox.min.css" />



<!-- 主题依赖的图标库，不要自行修改 -->
<!-- Do not modify the link that theme dependent icons -->

<link rel="stylesheet" href="//at.alicdn.com/t/font_1749284_hj8rtnfg7um.css">



<link rel="stylesheet" href="//at.alicdn.com/t/font_1736178_lbnruvf0jn.css">


<link  rel="stylesheet" href="/css/main.css" />


  <link id="highlight-css" rel="stylesheet" href="/css/highlight.css" />
  
    <link id="highlight-css-dark" rel="stylesheet" href="/css/highlight-dark.css" />
  



  
<link rel="stylesheet" href="/fluid/css/fluid-extention.css">
<link rel="stylesheet" href="/fluid/css/nihao.css">



  <script id="fluid-configs">
    var Fluid = window.Fluid || {};
    Fluid.ctx = Object.assign({}, Fluid.ctx)
    var CONFIG = {"hostname":"81.68.132.127","root":"/","version":"1.9.3","typing":{"enable":true,"typeSpeed":70,"cursorChar":"_","loop":false,"scope":[]},"anchorjs":{"enable":true,"element":"h1,h2,h3,h4,h5,h6","placement":"left","visible":"hover","icon":""},"progressbar":{"enable":true,"height_px":3,"color":"#29d","options":{"showSpinner":false,"trickleSpeed":100}},"code_language":{"enable":true,"default":"TEXT"},"copy_btn":true,"image_caption":{"enable":true},"image_zoom":{"enable":true,"img_url_replace":["",""]},"toc":{"enable":true,"placement":"left","headingSelector":"h1,h2,h3,h4,h5,h6","collapseDepth":3},"lazyload":{"enable":true,"loading_img":"https://ikkiss.oss-cn-hangzhou.aliyuncs.com/images/myblog/loading.gif","onlypost":false,"offset_factor":2},"web_analytics":{"enable":false,"follow_dnt":true,"baidu":null,"google":null,"gtag":null,"tencent":{"sid":null,"cid":null},"woyaola":null,"cnzz":null,"leancloud":{"app_id":null,"app_key":null,"server_url":null,"path":"window.location.pathname","ignore_local":false}},"search_path":"/local-search.xml"};

    if (CONFIG.web_analytics.follow_dnt) {
      var dntVal = navigator.doNotTrack || window.doNotTrack || navigator.msDoNotTrack;
      Fluid.ctx.dnt = dntVal && (dntVal.startsWith('1') || dntVal.startsWith('yes') || dntVal.startsWith('on'));
    }
  </script>
  <script  src="/js/utils.js" ></script>
  <script  src="/js/color-schema.js" ></script>
  


  
<meta name="generator" content="Hexo 5.4.2"></head>


<body>
  

  <header>
    

<div class="header-inner" style="height: 100vh;">
  <nav id="navbar" class="navbar fixed-top  navbar-expand-lg navbar-dark scrolling-navbar">
  <div class="container">
    <a class="navbar-brand" href="/">
      <strong>Ikki-BUG制造者</strong>
    </a>

    <button id="navbar-toggler-btn" class="navbar-toggler" type="button" data-toggle="collapse"
            data-target="#navbarSupportedContent"
            aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
      <div class="animated-icon"><span></span><span></span><span></span></div>
    </button>

    <!-- Collapsible content -->
    <div class="collapse navbar-collapse" id="navbarSupportedContent">
      <ul class="navbar-nav ml-auto text-center">
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/">
                <i class="iconfont icon-home-fill"></i>
                首页
              </a>
            </li>
          
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/archives/">
                <i class="iconfont icon-archive-fill"></i>
                归档
              </a>
            </li>
          
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/categories/">
                <i class="iconfont icon-category-fill"></i>
                分类
              </a>
            </li>
          
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/tags/">
                <i class="iconfont icon-tags-fill"></i>
                标签
              </a>
            </li>
          
        
          
          
          
          
            <li class="nav-item">
              <a class="nav-link" href="/about/">
                <i class="iconfont icon-user-fill"></i>
                关于
              </a>
            </li>
          
        
        
          <li class="nav-item" id="search-btn">
            <a class="nav-link" target="_self" href="javascript:;" data-toggle="modal" data-target="#modalSearch" aria-label="Search">
              &nbsp;<i class="iconfont icon-search"></i>&nbsp;
            </a>
          </li>
          
        
        
          <li class="nav-item" id="color-toggle-btn">
            <a class="nav-link" target="_self" href="javascript:;" aria-label="Color Toggle">&nbsp;<i
                class="iconfont icon-dark" id="color-toggle-icon"></i>&nbsp;</a>
          </li>
        
      </ul>
    </div>
  </div>
</nav>

  

<div id="banner" class="banner" parallax=true
     style="background: url('http://image.ikki0603.cn') no-repeat center center; background-size: cover;">
  <div class="full-bg-img">
    <div class="mask flex-center" style="background-color: rgba(0, 0, 0, 0.3)">
      <div class="banner-text text-center fade-in-up">
        <div class="h2">
          
            <span id="subtitle" data-typed-text="umi4+formily"></span>
          
        </div>

        
          
  <div class="mt-3">
    
    
      <span class="post-meta">
        <i class="iconfont icon-date-fill" aria-hidden="true"></i>
        <time datetime="2022-11-11 21:57" pubdate>
          2022年11月11日 晚上
        </time>
      </span>
    
  </div>

  <div class="mt-1">
    
      <span class="post-meta mr-2">
        <i class="iconfont icon-chart"></i>
        
          45k 字
        
      </span>
    

    
      <span class="post-meta mr-2">
        <i class="iconfont icon-clock-fill"></i>
        
        
        
          373 分钟
        
      </span>
    

    
    
      
        <span id="busuanzi_container_page_pv" style="display: none">
          <i class="iconfont icon-eye" aria-hidden="true"></i>
          <span id="busuanzi_value_page_pv"></span> 次
        </span>
        
      
    
  </div>


        
      </div>

      
        <div class="scroll-down-bar">
          <i class="iconfont icon-arrowdown"></i>
        </div>
      
    </div>
  </div>
</div>

</div>

  </header>

  <main>
    
      

<div class="container-fluid nopadding-x">
  <div class="row nomargin-x">
    <div class="side-col d-none d-lg-block col-lg-2">
      
  <aside class="sidebar" style="padding-left: 2rem; margin-right: -1rem">
    <div id="toc">
  <p class="toc-header"><i class="iconfont icon-list"></i>&nbsp;目录</p>
  <div class="toc-body" id="toc-body"></div>
</div>



  </aside>


    </div>

    <div class="col-lg-8 nopadding-x-md">
      <div class="container nopadding-x-md" id="board-ctn">
        <div id="board">
          <article class="post-content mx-auto">
            <!-- SEO header -->
            <h1 style="display: none">umi4+formily</h1>
            
              <p class="note note-info">
                
                  
                    本文最后更新于：2022年11月11日 晚上
                  
                
              </p>
            
            
              <div class="markdown-body">
                
                <h2 id="1-UMi4-Formily2"><a href="#1-UMi4-Formily2" class="headerlink" title="1.UMi4+Formily2 "></a>1.UMi4+Formily2 </h2><ul>
<li>  <a target="_blank" rel="noopener" href="https://umijs.org/">Umi4</a>是一个企业级开发框架</li>
<li>  <a target="_blank" rel="noopener" href="https://formilyjs.org/">formilyjs</a>是阿里巴巴统一前端表单解决方案</li>
</ul>
<h2 id="2-创建项目"><a href="#2-创建项目" class="headerlink" title="2.创建项目 "></a>2.创建项目 </h2><ul>
<li>  <a target="_blank" rel="noopener" href="https://www.pnpm.cn/">pnpm dlx</a>从源中获取包而不将其安装为依赖项，热加载，并运行它公开的任何默认命令二进制文件</li>
</ul>
<figure class="highlight dsconfig"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-pmannmlacl5vp2"></i><span>dsconfig</span><div class="collapse show" id="collapse-pmannmlacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><code class="hljs dsconfig"><span class="hljs-string">mkdir</span> <span class="hljs-string">cms-front</span> &amp;&amp; <span class="hljs-string">cd</span> <span class="hljs-string">cms-front</span> <br><span class="hljs-string">pnpm</span> <span class="hljs-string">dlx</span> <span class="hljs-built_in">create-umi@latest</span><br><span class="hljs-string">cnpm</span> <span class="hljs-string">i</span> <span class="hljs-string">ahooks</span> <span class="hljs-string">query-string</span> @<span class="hljs-string">formily</span>/<span class="hljs-string">core</span> @<span class="hljs-string">formily</span>/<span class="hljs-string">react</span> @<span class="hljs-string">formily</span>/<span class="hljs-string">antd</span> <span class="hljs-built_in">--save</span><br><span class="hljs-string">pnpm</span> <span class="hljs-string">dev</span><br><br></code></pre></td></tr></table></div></figure>

<h2 id="3-配置项目"><a href="#3-配置项目" class="headerlink" title="3.配置项目 "></a>3.配置项目 </h2><h3 id="3-1-umirc-ts"><a href="#3-1-umirc-ts" class="headerlink" title="3.1 .umirc.ts"></a>3.1 .umirc.ts</h3><p>.umirc.ts</p>
<figure class="highlight php"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-k1tftilacl5vp2"></i><span>php</span><div class="collapse show" id="collapse-k1tftilacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br></pre></td><td class="code"><pre><code class="hljs php">import &#123; defineConfig &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@umijs/max&#x27;</span>;<br>export <span class="hljs-keyword">default</span> <span class="hljs-title function_ invoke__">defineConfig</span>(&#123;<br>  <span class="hljs-attr">antd</span>: &#123;&#125;,<br>  <span class="hljs-attr">access</span>: &#123;&#125;,<br>  <span class="hljs-attr">model</span>: &#123;&#125;,<br>  <span class="hljs-attr">initialState</span>: &#123;&#125;,<br>+ <span class="hljs-attr">request</span>: &#123; <span class="hljs-attr">dataField</span>: <span class="hljs-string">&#x27;data&#x27;</span> &#125;,<br>  <span class="hljs-attr">layout</span>: &#123;<br>+   <span class="hljs-attr">title</span>: <span class="hljs-string">&#x27;CMS&#x27;</span>,<br>  &#125;,<br>  <span class="hljs-attr">routes</span>: [<br>    &#123;<br>      <span class="hljs-attr">path</span>: <span class="hljs-string">&#x27;/&#x27;</span>,<br>      <span class="hljs-attr">redirect</span>: <span class="hljs-string">&#x27;/home&#x27;</span>,<br>    &#125;,<br>    &#123;<br>      <span class="hljs-attr">name</span>: <span class="hljs-string">&#x27;首页&#x27;</span>,<br>      <span class="hljs-attr">path</span>: <span class="hljs-string">&#x27;/home&#x27;</span>,<br>      <span class="hljs-attr">component</span>: <span class="hljs-string">&#x27;./Home&#x27;</span>,<br>    &#125;,<br>+   &#123;<br>+     <span class="hljs-attr">name</span>: <span class="hljs-string">&#x27;实体管理&#x27;</span>,<br>+     <span class="hljs-attr">path</span>: <span class="hljs-string">&#x27;/entity&#x27;</span>,<br>+     <span class="hljs-attr">component</span>: <span class="hljs-string">&#x27;./Table&#x27;</span>,<br>+   &#125;<br>  ],<br>  <span class="hljs-attr">npmClient</span>: <span class="hljs-string">&#x27;cnpm&#x27;</span>,<br>+ <span class="hljs-attr">proxy</span>: &#123;<br>+   <span class="hljs-string">&#x27;/api&#x27;</span>: &#123;<br>+     <span class="hljs-attr">target</span>: <span class="hljs-string">&#x27;http://localhost:7001&#x27;</span>,<br>+     <span class="hljs-attr">pathRewrite</span>: &#123;<br>+       <span class="hljs-string">&quot;^/api&quot;</span>: <span class="hljs-string">&quot;&quot;</span><br>+     &#125;,<br>+     <span class="hljs-attr">changeOrigin</span>: <span class="hljs-literal">true</span><br>+   &#125;<br>+ &#125;<br>&#125;);<br><br></code></pre></td></tr></table></div></figure>

<h3 id="3-2-src-app-ts"><a href="#3-2-src-app-ts" class="headerlink" title="3.2 src\app.ts"></a>3.2 src\app.ts</h3><p>src\app.ts</p>
<figure class="highlight coffeescript"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-9yo46dlacl5vp2"></i><span>coffeescript</span><div class="collapse show" id="collapse-9yo46dlacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><code class="hljs coffeescript">+<span class="hljs-keyword">import</span> &#123; request &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;umi&#x27;</span>;<br><span class="hljs-keyword">export</span> <span class="hljs-keyword">async</span> function getInitialState(): <span class="hljs-built_in">Promise</span>&lt;&#123; name: string &#125;&gt; &#123;<br>+  <span class="hljs-keyword">return</span> &#123; name: <span class="hljs-string">&#x27;CMS&#x27;</span> &#125;;<br>&#125;<br><br><span class="hljs-keyword">export</span> const layout = <span class="hljs-function"><span class="hljs-params">()</span> =&gt;</span> &#123;<br>  <span class="hljs-keyword">return</span> &#123;<br>    logo: <span class="hljs-string">&#x27;https://img.alicdn.com/tfs/TB1YHEpwUT1gK0jSZFhXXaAtVXa-28-27.svg&#x27;</span>,<br>    menu: &#123;<br>      locale: <span class="hljs-literal">false</span>,<br>+     request: <span class="hljs-function"><span class="hljs-params">()</span> =&gt;</span> request(<span class="hljs-string">&#x27;/api/menu&#x27;</span>).<span class="hljs-keyword">then</span>(res =&gt; res.data.list)<br>    &#125;,<br>  &#125;;<br>&#125;;<br><br></code></pre></td></tr></table></div></figure>

<h3 id="3-3-tsconfig-json"><a href="#3-3-tsconfig-json" class="headerlink" title="3.3 tsconfig.json"></a>3.3 tsconfig.json</h3><p>tsconfig.json</p>
<figure class="highlight actionscript"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-sds5khlacl5vp2"></i><span>actionscript</span><div class="collapse show" id="collapse-sds5khlacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><code class="hljs actionscript">&#123;<br>  <span class="hljs-string">&quot;extends&quot;</span>: <span class="hljs-string">&quot;./src/.umi/tsconfig.json&quot;</span>,<br>+  <span class="hljs-string">&quot;compilerOptions&quot;</span>: &#123;<br>+    <span class="hljs-string">&quot;strict&quot;</span>: <span class="hljs-literal">false</span>,<br>+    <span class="hljs-string">&quot;noImplicitAny&quot;</span>: <span class="hljs-literal">false</span><br>+  &#125;<br>&#125;<br><br></code></pre></td></tr></table></div></figure>

<h2 id="4-查询删除实体"><a href="#4-查询删除实体" class="headerlink" title="4.查询删除实体 "></a>4.查询删除实体 </h2><h3 id="4-1-umirc-ts"><a href="#4-1-umirc-ts" class="headerlink" title="4.1 .umirc.ts"></a>4.1 .umirc.ts</h3><p>.umirc.ts</p>
<figure class="highlight pgsql"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-y8yl5flacl5vp2"></i><span>pgsql</span><div class="collapse show" id="collapse-y8yl5flacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs pgsql">    &#123;<br>      <span class="hljs-type">name</span>: <span class="hljs-string">&#x27;实体管理&#x27;</span>,<br>      <span class="hljs-type">path</span>: <span class="hljs-string">&#x27;/entity&#x27;</span>,<br>+     component: <span class="hljs-string">&#x27;./Entity&#x27;</span>,<br>    &#125;<br><br></code></pre></td></tr></table></div></figure>

<h3 id="4-2-src-pages-Entity-index-tsx"><a href="#4-2-src-pages-Entity-index-tsx" class="headerlink" title="4.2 src\pages\Entity\index.tsx"></a>4.2 src\pages\Entity\index.tsx</h3><p>src\pages\Entity\index.tsx</p>
<figure class="highlight typescript"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-e7ahfxlacl5vp2"></i><span>typescript</span><div class="collapse show" id="collapse-e7ahfxlacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br><span class="line">75</span><br><span class="line">76</span><br><span class="line">77</span><br><span class="line">78</span><br><span class="line">79</span><br><span class="line">80</span><br><span class="line">81</span><br><span class="line">82</span><br><span class="line">83</span><br><span class="line">84</span><br><span class="line">85</span><br><span class="line">86</span><br><span class="line">87</span><br><span class="line">88</span><br><span class="line">89</span><br><span class="line">90</span><br><span class="line">91</span><br><span class="line">92</span><br><span class="line">93</span><br><span class="line">94</span><br><span class="line">95</span><br><span class="line">96</span><br><span class="line">97</span><br><span class="line">98</span><br><span class="line">99</span><br><span class="line">100</span><br><span class="line">101</span><br><span class="line">102</span><br><span class="line">103</span><br><span class="line">104</span><br><span class="line">105</span><br><span class="line">106</span><br><span class="line">107</span><br><span class="line">108</span><br><span class="line">109</span><br><span class="line">110</span><br><span class="line">111</span><br><span class="line">112</span><br><span class="line">113</span><br><span class="line">114</span><br><span class="line">115</span><br><span class="line">116</span><br><span class="line">117</span><br><span class="line">118</span><br><span class="line">119</span><br><span class="line">120</span><br><span class="line">121</span><br><span class="line">122</span><br><span class="line">123</span><br><span class="line">124</span><br><span class="line">125</span><br><span class="line">126</span><br><span class="line">127</span><br><span class="line">128</span><br><span class="line">129</span><br><span class="line">130</span><br><span class="line">131</span><br><span class="line">132</span><br><span class="line">133</span><br><span class="line">134</span><br><span class="line">135</span><br><span class="line">136</span><br><span class="line">137</span><br><span class="line">138</span><br><span class="line">139</span><br><span class="line">140</span><br><span class="line">141</span><br><span class="line">142</span><br><span class="line">143</span><br><span class="line">144</span><br><span class="line">145</span><br><span class="line">146</span><br><span class="line">147</span><br><span class="line">148</span><br><span class="line">149</span><br><span class="line">150</span><br><span class="line">151</span><br><span class="line">152</span><br><span class="line">153</span><br><span class="line">154</span><br><span class="line">155</span><br><span class="line">156</span><br><span class="line">157</span><br><span class="line">158</span><br><span class="line">159</span><br><span class="line">160</span><br><span class="line">161</span><br><span class="line">162</span><br><span class="line">163</span><br><span class="line">164</span><br><span class="line">165</span><br><span class="line">166</span><br><span class="line">167</span><br><span class="line">168</span><br><span class="line">169</span><br><span class="line">170</span><br><span class="line">171</span><br><span class="line">172</span><br><span class="line">173</span><br><span class="line">174</span><br><span class="line">175</span><br><span class="line">176</span><br><span class="line">177</span><br><span class="line">178</span><br><span class="line">179</span><br><span class="line">180</span><br><span class="line">181</span><br><span class="line">182</span><br><span class="line">183</span><br><span class="line">184</span><br><span class="line">185</span><br><span class="line">186</span><br><span class="line">187</span><br><span class="line">188</span><br><span class="line">189</span><br><span class="line">190</span><br><span class="line">191</span><br><span class="line">192</span><br><span class="line">193</span><br><span class="line">194</span><br><span class="line">195</span><br><span class="line">196</span><br><span class="line">197</span><br><span class="line">198</span><br><span class="line">199</span><br><span class="line">200</span><br><span class="line">201</span><br><span class="line">202</span><br><span class="line">203</span><br><span class="line">204</span><br><span class="line">205</span><br><span class="line">206</span><br><span class="line">207</span><br><span class="line">208</span><br><span class="line">209</span><br><span class="line">210</span><br><span class="line">211</span><br><span class="line">212</span><br><span class="line">213</span><br><span class="line">214</span><br><span class="line">215</span><br><span class="line">216</span><br><span class="line">217</span><br><span class="line">218</span><br><span class="line">219</span><br><span class="line">220</span><br><span class="line">221</span><br><span class="line">222</span><br><span class="line">223</span><br><span class="line">224</span><br><span class="line">225</span><br></pre></td><td class="code"><pre><code class="hljs typescript"><span class="hljs-keyword">import</span> &#123; useState &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;react&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; <span class="hljs-title class_">Table</span>, <span class="hljs-title class_">Card</span>, <span class="hljs-title class_">Row</span>, <span class="hljs-title class_">Col</span>, <span class="hljs-title class_">Pagination</span>, <span class="hljs-title class_">Space</span>, <span class="hljs-title class_">Modal</span>, <span class="hljs-title class_">List</span>, message, <span class="hljs-title class_">Button</span> &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;antd&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; createForm &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@formily/core&#x27;</span><br><span class="hljs-keyword">import</span> &#123; createSchemaField &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@formily/react&#x27;</span><br><span class="hljs-keyword">import</span> &#123; <span class="hljs-title class_">Form</span>, <span class="hljs-title class_">FormItem</span>, <span class="hljs-title class_">Input</span>, <span class="hljs-title class_">FormGrid</span>, <span class="hljs-title class_">Submit</span>, <span class="hljs-title class_">Reset</span>, <span class="hljs-title class_">DatePicker</span>, <span class="hljs-title class_">FormButtonGroup</span> &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@formily/antd&#x27;</span><br><span class="hljs-keyword">import</span> &#123; <span class="hljs-title class_">FooterToolbar</span>, <span class="hljs-title class_">PageContainer</span> &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@ant-design/pro-components&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; request, useRequest, history &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;umi&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; useToggle &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;ahooks&#x27;</span>;<br><span class="hljs-keyword">import</span> moment <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;moment&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; <span class="hljs-title class_">ExclamationCircleOutlined</span>, <span class="hljs-title class_">SearchOutlined</span> &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@ant-design/icons&#x27;</span>;<br><span class="hljs-keyword">import</span> <span class="hljs-title class_">Qs</span> <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;query-string&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; formToValues &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@/utils/transformer/fieldValue&#x27;</span>;<br><span class="hljs-keyword">const</span> searchForm = <span class="hljs-title function_">createForm</span>(&#123;<br>  <span class="hljs-attr">validateFirst</span>: <span class="hljs-literal">true</span>,<br>&#125;)<br><span class="hljs-keyword">const</span> <span class="hljs-title class_">SchemaField</span> = <span class="hljs-title function_">createSchemaField</span>(&#123;<br>  <span class="hljs-attr">components</span>: &#123;<br>    <span class="hljs-title class_">FormItem</span>,<br>    <span class="hljs-title class_">Input</span>,<br>    <span class="hljs-title class_">FormGrid</span>,<br>    <span class="hljs-title class_">DatePicker</span>,<br>    <span class="hljs-title class_">FormButtonGroup</span><br>  &#125;<br>&#125;)<br><span class="hljs-keyword">const</span> <span class="hljs-title function_">Entity</span> = (<span class="hljs-params"></span>) =&gt; &#123;<br>  <span class="hljs-keyword">const</span> [&#123; current, pageSize &#125;, setPageConfig] = <span class="hljs-title function_">useState</span>(&#123; <span class="hljs-attr">current</span>: <span class="hljs-number">1</span>, <span class="hljs-attr">pageSize</span>: <span class="hljs-number">10</span> &#125;);<br>  <span class="hljs-keyword">const</span> [sorter, setSorter] = useState&lt;<span class="hljs-built_in">any</span>&gt;();<br>  <span class="hljs-keyword">const</span> [searchVisible, &#123; toggle &#125;] = <span class="hljs-title function_">useToggle</span>(<span class="hljs-literal">false</span>);<br>  <span class="hljs-keyword">const</span> [selectedRowKeys, setSelectedRowKeys] = <span class="hljs-title function_">useState</span>([]);<br>  <span class="hljs-keyword">const</span> [selectedRows, setSelectedRows] = <span class="hljs-title function_">useState</span>([]);<br>  <span class="hljs-keyword">const</span> loadQuery = <span class="hljs-title function_">useRequest</span>(<span class="hljs-function">(<span class="hljs-params">params = &#123;&#125;</span>) =&gt;</span><br>    <span class="hljs-title function_">request</span>(<span class="hljs-string">`/api/entity`</span>, &#123;<br>      <span class="hljs-attr">params</span>: &#123;<br>        current,<br>        pageSize,<br>        <span class="hljs-attr">sort</span>: sorter?.<span class="hljs-property">field</span>,<br>        <span class="hljs-attr">order</span>: sorter?.<span class="hljs-property">order</span>?.<span class="hljs-title function_">slice</span>(<span class="hljs-number">0</span>, -<span class="hljs-number">3</span>),<br>        ...params<br>      &#125;,<br>      <span class="hljs-title function_">paramsSerializer</span>(<span class="hljs-params">params</span>) &#123;<br>        <span class="hljs-keyword">return</span> <span class="hljs-title class_">Qs</span>.<span class="hljs-title function_">stringify</span>(params, &#123; <span class="hljs-attr">arrayFormat</span>: <span class="hljs-string">&#x27;comma&#x27;</span>, <span class="hljs-attr">skipEmptyString</span>: <span class="hljs-literal">true</span>, <span class="hljs-attr">skipNull</span>: <span class="hljs-literal">true</span> &#125;)<br>      &#125;,<br>    &#125;), &#123;<br>    <span class="hljs-attr">refreshDeps</span>: [current, pageSize, sorter]<br>  &#125;);<br>  <span class="hljs-keyword">const</span> deleteQuery = <span class="hljs-title function_">useRequest</span>(<span class="hljs-function">(<span class="hljs-params">ids</span>) =&gt;</span><br>    <span class="hljs-title function_">request</span>(<span class="hljs-string">`/api/entity/<span class="hljs-subst">$&#123;ids[<span class="hljs-number">0</span>]&#125;</span>`</span>, &#123;<br>      <span class="hljs-attr">method</span>: <span class="hljs-string">&#x27;DELETE&#x27;</span>,<br>      <span class="hljs-attr">data</span>: ids<br>    &#125;), &#123;<br>    <span class="hljs-attr">manual</span>: <span class="hljs-literal">true</span>,<br>    <span class="hljs-title function_">onSuccess</span>(<span class="hljs-params">data</span>) &#123;<br>      message.<span class="hljs-title function_">success</span>(data.<span class="hljs-property">message</span>);<br>      loadQuery.<span class="hljs-title function_">refresh</span>();<br>    &#125;,<br>    <span class="hljs-title function_">formatResult</span>(<span class="hljs-params">res</span>) &#123;<br>      <span class="hljs-keyword">return</span> res;<br>    &#125;<br>  &#125;);<br>  <span class="hljs-keyword">const</span> <span class="hljs-title function_">deleteRecords</span> = (<span class="hljs-params">records</span>) =&gt; &#123;<br>    <span class="hljs-title class_">Modal</span>.<span class="hljs-title function_">confirm</span>(&#123;<br>      <span class="hljs-attr">title</span>: <span class="hljs-string">&#x27;确定删除以下记录吗?&#x27;</span>,<br>      <span class="hljs-attr">icon</span>: <span class="language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">ExclamationCircleOutlined</span> /&gt;</span></span>,<br>      <span class="hljs-attr">content</span>: (<br>        <span class="language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">List</span></span></span><br><span class="hljs-tag"><span class="language-xml">          <span class="hljs-attr">bordered</span></span></span><br><span class="hljs-tag"><span class="language-xml">          <span class="hljs-attr">dataSource</span>=<span class="hljs-string">&#123;records.map(record</span> =&gt;</span> record.name)&#125;</span><br><span class="language-xml">          renderItem=&#123;(item: any) =&gt; (</span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">List.Item</span>&gt;</span>&#123;item&#125;<span class="hljs-tag">&lt;/<span class="hljs-name">List.Item</span>&gt;</span></span><br><span class="language-xml">          )&#125;</span><br><span class="language-xml">        /&gt;</span><br>      ),<br>      <span class="hljs-attr">okText</span>: <span class="hljs-string">&#x27;是&#x27;</span>,<br>      <span class="hljs-attr">cancelText</span>: <span class="hljs-string">&#x27;否&#x27;</span>,<br>      <span class="hljs-attr">okType</span>: <span class="hljs-string">&#x27;danger&#x27;</span>,<br>      <span class="hljs-title function_">onOk</span>(<span class="hljs-params"></span>) &#123;<br>        <span class="hljs-keyword">return</span> deleteQuery.<span class="hljs-title function_">run</span>(records.<span class="hljs-title function_">map</span>(<span class="hljs-function"><span class="hljs-params">record</span> =&gt;</span> record.<span class="hljs-property">id</span>))<br>      &#125;<br>    &#125;);<br>  &#125;<br>  <span class="hljs-keyword">const</span> rowSelection = &#123;<br>    selectedRowKeys,<br>    <span class="hljs-attr">onChange</span>: <span class="hljs-function">(<span class="hljs-params">selectedRowKeys, selectedRows</span>) =&gt;</span> &#123;<br>      <span class="hljs-title function_">setSelectedRowKeys</span>(selectedRowKeys);<br>      <span class="hljs-title function_">setSelectedRows</span>(selectedRows);<br>    &#125;<br>  &#125;<br>  <span class="hljs-keyword">const</span> <span class="hljs-title function_">handleSubmit</span> = (<span class="hljs-params">values</span>) =&gt; &#123;<br>    loadQuery.<span class="hljs-title function_">run</span>(<span class="hljs-title function_">formToValues</span>(values));<br>  &#125;<br>  <span class="hljs-keyword">const</span> columns = [<br>    &#123; <span class="hljs-attr">title</span>: <span class="hljs-string">&#x27;ID&#x27;</span>, <span class="hljs-attr">dataIndex</span>: <span class="hljs-string">&#x27;id&#x27;</span>, <span class="hljs-attr">key</span>: <span class="hljs-string">&#x27;id&#x27;</span>, <span class="hljs-attr">sorter</span>: <span class="hljs-literal">true</span> &#125;,<br>    &#123; <span class="hljs-attr">title</span>: <span class="hljs-string">&#x27;名称&#x27;</span>, <span class="hljs-attr">dataIndex</span>: <span class="hljs-string">&#x27;name&#x27;</span>, <span class="hljs-attr">key</span>: <span class="hljs-string">&#x27;name&#x27;</span> &#125;,<br>    &#123; <span class="hljs-attr">title</span>: <span class="hljs-string">&#x27;标题&#x27;</span>, <span class="hljs-attr">dataIndex</span>: <span class="hljs-string">&#x27;title&#x27;</span>, <span class="hljs-attr">key</span>: <span class="hljs-string">&#x27;title&#x27;</span> &#125;,<br>    &#123;<br>      <span class="hljs-attr">title</span>: <span class="hljs-string">&#x27;操作&#x27;</span>, <span class="hljs-attr">dataIndex</span>: <span class="hljs-string">&#x27;operations&#x27;</span>, <span class="hljs-attr">key</span>: <span class="hljs-string">&#x27;operations&#x27;</span>, <span class="hljs-attr">render</span>: <span class="hljs-function">(<span class="hljs-params">_, record</span>) =&gt;</span> (<br>        <span class="language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">Space</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">Button</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">type</span>=<span class="hljs-string">&quot;default&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">onClick</span>=<span class="hljs-string">&#123;()</span> =&gt;</span> history.push(`/entity/edit?id=$&#123;record.id&#125;`)&#125;</span><br><span class="language-xml">          &gt;编辑<span class="hljs-tag">&lt;/<span class="hljs-name">Button</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">Button</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">type</span>=<span class="hljs-string">&quot;primary&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">onClick</span>=<span class="hljs-string">&#123;()</span> =&gt;</span> deleteRecords([record])&#125;</span><br><span class="language-xml">          &gt;删除<span class="hljs-tag">&lt;/<span class="hljs-name">Button</span>&gt;</span></span><br><span class="language-xml">        <span class="hljs-tag">&lt;/<span class="hljs-name">Space</span>&gt;</span></span><br>      )<br>    &#125;<br>  ]<br>  <span class="hljs-keyword">return</span> (<br>    <span class="language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">PageContainer</span>&gt;</span></span><br><span class="language-xml">      &#123;</span><br><span class="language-xml">        searchVisible &amp;&amp; (</span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">Card</span> <span class="hljs-attr">key</span>=<span class="hljs-string">&quot;search&quot;</span>&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">Form</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">layout</span>=<span class="hljs-string">&quot;inline&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">form</span>=<span class="hljs-string">&#123;searchForm&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">onAutoSubmit</span>=<span class="hljs-string">&#123;handleSubmit&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            &gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField</span>&gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;FormGrid&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component-props</span>=<span class="hljs-string">&#123;&#123;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">maxColumns:</span> <span class="hljs-attr">4</span>,</span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">minColumns:</span> <span class="hljs-attr">2</span>,</span></span><br><span class="hljs-tag"><span class="language-xml">                  &#125;&#125;</span></span><br><span class="hljs-tag"><span class="language-xml">                &gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;name&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;名称&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Input&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  /&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;title&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;标题&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Input&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  /&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;created&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;创建时间&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">x-decorator-props</span>=<span class="hljs-string">&#123;&#123;</span> <span class="hljs-attr">gridSpan:</span> <span class="hljs-attr">2</span> &#125;&#125;</span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;DatePicker.RangePicker&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">x-component-props</span>=<span class="hljs-string">&#123;&#123;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">showTime:</span> <span class="hljs-attr">true</span>, <span class="hljs-attr">ranges:</span> &#123;</span></span><br><span class="hljs-tag"><span class="language-xml">                        &#x27;<span class="hljs-attr">今天</span>&#x27;<span class="hljs-attr">:</span> [<span class="hljs-attr">moment</span>()<span class="hljs-attr">.startOf</span>(&#x27;<span class="hljs-attr">day</span>&#x27;), <span class="hljs-attr">moment</span>()],</span></span><br><span class="hljs-tag"><span class="language-xml">                        &#x27;<span class="hljs-attr">本月</span>&#x27;<span class="hljs-attr">:</span> [<span class="hljs-attr">moment</span>()<span class="hljs-attr">.startOf</span>(&#x27;<span class="hljs-attr">month</span>&#x27;), <span class="hljs-attr">moment</span>()<span class="hljs-attr">.endOf</span>(&#x27;<span class="hljs-attr">month</span>&#x27;)],</span></span><br><span class="hljs-tag"><span class="language-xml">                        &#x27;<span class="hljs-attr">上周</span>&#x27;<span class="hljs-attr">:</span> [<span class="hljs-attr">moment</span>()<span class="hljs-attr">.subtract</span>(<span class="hljs-attr">7</span>, &#x27;<span class="hljs-attr">days</span>&#x27;), <span class="hljs-attr">moment</span>()],</span></span><br><span class="hljs-tag"><span class="language-xml">                        &#x27;<span class="hljs-attr">上月</span>&#x27;<span class="hljs-attr">:</span> [<span class="hljs-attr">moment</span>()<span class="hljs-attr">.subtract</span>(<span class="hljs-attr">1</span>, &#x27;<span class="hljs-attr">months</span>&#x27;)<span class="hljs-attr">.startOf</span>(&#x27;<span class="hljs-attr">month</span>&#x27;), <span class="hljs-attr">moment</span>()<span class="hljs-attr">.subtract</span>(<span class="hljs-attr">1</span>, &#x27;<span class="hljs-attr">months</span>&#x27;)<span class="hljs-attr">.endOf</span>(&#x27;<span class="hljs-attr">month</span>&#x27;)]</span></span><br><span class="hljs-tag"><span class="language-xml">                      &#125;</span></span><br><span class="hljs-tag"><span class="language-xml">                    &#125;&#125;</span></span><br><span class="hljs-tag"><span class="language-xml">                  /&gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">FormButtonGroup.FormItem</span>&gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">Submit</span>&gt;</span></span><br><span class="language-xml">                  查询</span><br><span class="language-xml">                <span class="hljs-tag">&lt;/<span class="hljs-name">Submit</span>&gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">Reset</span> &gt;</span></span><br><span class="language-xml">                  重置</span><br><span class="language-xml">                <span class="hljs-tag">&lt;/<span class="hljs-name">Reset</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">FormButtonGroup.FormItem</span>&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;/<span class="hljs-name">Form</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;/<span class="hljs-name">Card</span>&gt;</span></span><br><span class="language-xml">        )</span><br><span class="language-xml">      &#125;</span><br><span class="language-xml">      <span class="hljs-tag">&lt;<span class="hljs-name">Card</span>&gt;</span></span><br><span class="language-xml">        <span class="hljs-tag">&lt;<span class="hljs-name">Row</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">Col</span> <span class="hljs-attr">xs</span>=<span class="hljs-string">&#123;24&#125;</span> <span class="hljs-attr">style</span>=<span class="hljs-string">&#123;&#123;</span> <span class="hljs-attr">textAlign:</span> &#x27;<span class="hljs-attr">right</span>&#x27;, <span class="hljs-attr">padding:</span> &#x27;<span class="hljs-attr">10px</span>&#x27; &#125;&#125;&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">Space</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">Button</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">shape</span>=<span class="hljs-string">&#x27;circle&#x27;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">icon</span>=<span class="hljs-string">&#123;</span>&lt;<span class="hljs-attr">SearchOutlined</span> /&gt;</span>&#125;</span><br><span class="language-xml">                onClick=&#123;toggle&#125;</span><br><span class="language-xml">                type=&#123;searchVisible ? &#x27;primary&#x27; : &#x27;default&#x27;&#125;</span><br><span class="language-xml">              /&gt;</span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">Button</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">type</span>=<span class="hljs-string">&quot;primary&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">onClick</span>=<span class="hljs-string">&#123;()</span> =&gt;</span> history.push(&#x27;/entity/edit&#x27;)&#125;</span><br><span class="language-xml">              &gt;添加<span class="hljs-tag">&lt;/<span class="hljs-name">Button</span>&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;/<span class="hljs-name">Space</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;/<span class="hljs-name">Col</span>&gt;</span></span><br><span class="language-xml">        <span class="hljs-tag">&lt;/<span class="hljs-name">Row</span>&gt;</span></span><br><span class="language-xml">        <span class="hljs-tag">&lt;<span class="hljs-name">Table</span></span></span><br><span class="hljs-tag"><span class="language-xml">          <span class="hljs-attr">dataSource</span>=<span class="hljs-string">&#123;loadQuery.data?.list&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">          <span class="hljs-attr">columns</span>=<span class="hljs-string">&#123;columns&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">          <span class="hljs-attr">loading</span>=<span class="hljs-string">&#123;loadQuery.loading&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">          <span class="hljs-attr">rowKey</span>=<span class="hljs-string">&#123;row</span> =&gt;</span> row.id&#125;</span><br><span class="language-xml">          pagination=&#123;false&#125;</span><br><span class="language-xml">          onChange=&#123;(_, __, sorter) =&gt; setSorter(sorter)&#125;</span><br><span class="language-xml">          rowSelection=&#123;rowSelection&#125;</span><br><span class="language-xml">        /&gt;</span><br><span class="language-xml">        <span class="hljs-tag">&lt;<span class="hljs-name">Row</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">Col</span> <span class="hljs-attr">xs</span>=<span class="hljs-string">&#123;24&#125;</span> <span class="hljs-attr">style</span>=<span class="hljs-string">&#123;&#123;</span> <span class="hljs-attr">textAlign:</span> &#x27;<span class="hljs-attr">right</span>&#x27;, <span class="hljs-attr">padding:</span> &#x27;<span class="hljs-attr">10px</span>&#x27; &#125;&#125;&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">Pagination</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">total</span>=<span class="hljs-string">&#123;loadQuery.data?.total</span> || <span class="hljs-attr">0</span>&#125;</span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">current</span>=<span class="hljs-string">&#123;loadQuery.data?.current</span> || <span class="hljs-attr">1</span>&#125;</span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">pageSize</span>=<span class="hljs-string">&#123;loadQuery.data?.pageSize</span> || <span class="hljs-attr">10</span>&#125;</span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">showSizeChanger</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">showQuickJumper</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">showTotal</span>=<span class="hljs-string">&#123;total</span> =&gt;</span> `总计$&#123;total&#125;条`&#125;</span><br><span class="language-xml">              onChange=&#123;(current, pageSize) =&gt; setPageConfig(&#123; current, pageSize &#125;)&#125;</span><br><span class="language-xml">            /&gt;</span><br><span class="language-xml">          <span class="hljs-tag">&lt;/<span class="hljs-name">Col</span>&gt;</span></span><br><span class="language-xml">        <span class="hljs-tag">&lt;/<span class="hljs-name">Row</span>&gt;</span></span><br><span class="language-xml">      <span class="hljs-tag">&lt;/<span class="hljs-name">Card</span>&gt;</span></span><br><span class="language-xml">      &#123;</span><br><span class="language-xml">        selectedRowKeys.length &gt; 0 &amp;&amp; (</span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">FooterToolbar</span> <span class="hljs-attr">extra</span>=<span class="hljs-string">&#123;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            &lt;<span class="hljs-attr">Space</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">Button</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">type</span>=<span class="hljs-string">&quot;primary&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">onClick</span>=<span class="hljs-string">&#123;()</span> =&gt;</span> deleteRecords(selectedRows)&#125;</span><br><span class="language-xml">              &gt;删除<span class="hljs-tag">&lt;/<span class="hljs-name">Button</span>&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;/<span class="hljs-name">Space</span>&gt;</span></span><br><span class="language-xml">          &#125; /&gt;</span><br><span class="language-xml">        )</span><br><span class="language-xml">      &#125;</span><br><span class="language-xml">    <span class="hljs-tag">&lt;/<span class="hljs-name">PageContainer</span>&gt;</span></span><br>  )<br>&#125;<br><span class="hljs-keyword">export</span> <span class="hljs-keyword">default</span> <span class="hljs-title class_">Entity</span><br><br></code></pre></td></tr></table></div></figure>

<h3 id="4-3-fieldValue-tsx"><a href="#4-3-fieldValue-tsx" class="headerlink" title="4.3 fieldValue.tsx"></a>4.3 fieldValue.tsx</h3><p>src\utils\transformer\fieldValue.tsx</p>
<figure class="highlight reasonml"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-cwoo04lacl5vp2"></i><span>reasonml</span><div class="collapse show" id="collapse-cwoo04lacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br></pre></td><td class="code"><pre><code class="hljs reasonml">import moment from &#x27;moment&#x27;;<br>export <span class="hljs-keyword">function</span> form<span class="hljs-constructor">ToValues(<span class="hljs-params">values</span>)</span> &#123;<br>  <span class="hljs-keyword">let</span> result = <span class="hljs-module-access"><span class="hljs-module"><span class="hljs-identifier">Array</span>.</span></span>is<span class="hljs-constructor">Array(<span class="hljs-params">values</span>)</span> ? <span class="hljs-literal">[]</span> : &#123;&#125;;<br>  <span class="hljs-keyword">for</span> (<span class="hljs-keyword">let</span> key <span class="hljs-keyword">in</span> values) &#123;<br>    <span class="hljs-keyword">let</span> value = values<span class="hljs-literal">[<span class="hljs-identifier">key</span>]</span>;<br>    <span class="hljs-keyword">if</span> (typeof value<span class="hljs-operator"> === </span>&#x27;boolean&#x27;) &#123;<br>      value = value ? <span class="hljs-number">1</span> : <span class="hljs-number">0</span>;<br>    &#125; <span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span> (moment.is<span class="hljs-constructor">Moment(<span class="hljs-params">value</span>)</span>) &#123;<br>      value = value.format<span class="hljs-literal">()</span><br>    &#125; <span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span> (<span class="hljs-module-access"><span class="hljs-module"><span class="hljs-identifier">Array</span>.</span></span>is<span class="hljs-constructor">Array(<span class="hljs-params">value</span>)</span>) &#123;<br>      value = form<span class="hljs-constructor">ToValues(<span class="hljs-params">value</span>)</span><br>    &#125;<br>    result<span class="hljs-literal">[<span class="hljs-identifier">key</span>]</span> = value;<br>  &#125;<br>  return result;<br>&#125;<br><br></code></pre></td></tr></table></div></figure>

<h2 id="5-添加修改实体"><a href="#5-添加修改实体" class="headerlink" title="5.添加修改实体 "></a>5.添加修改实体 </h2><h3 id="5-1-umirc-ts"><a href="#5-1-umirc-ts" class="headerlink" title="5.1 .umirc.ts"></a>5.1 .umirc.ts</h3><p>.umirc.ts</p>
<figure class="highlight markdown"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-kons0xlacl5vp2"></i><span>markdown</span><div class="collapse show" id="collapse-kons0xlacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs markdown"><span class="hljs-bullet">+</span>   &#123;<br><span class="hljs-bullet">+</span>     name: &#x27;实体编辑&#x27;,<br><span class="hljs-bullet">+</span>     path: &#x27;/entity/edit&#x27;,<br><span class="hljs-bullet">+</span>     component: &#x27;./EntityEdit&#x27;,<br><span class="hljs-bullet">+</span>   &#125;<br><br></code></pre></td></tr></table></div></figure>

<h3 id="5-2-src-constants-enums-ts"><a href="#5-2-src-constants-enums-ts" class="headerlink" title="5.2 src\constants\enums.ts"></a>5.2 src\constants\enums.ts</h3><p>src\constants\enums.ts</p>
<figure class="highlight dart"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-lrnp5rlacl5vp2"></i><span>dart</span><div class="collapse show" id="collapse-lrnp5rlacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br></pre></td><td class="code"><pre><code class="hljs dart"><span class="hljs-comment">//字段类型</span><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">enum</span> FIELD_TYPES &#123;<br>    text = <span class="hljs-string">&#x27;text&#x27;</span>,<br>    number = <span class="hljs-string">&#x27;number&#x27;</span>,<br>    select = <span class="hljs-string">&#x27;select&#x27;</span>,<br>    datetime = <span class="hljs-string">&#x27;datetime&#x27;</span>,<br>    <span class="hljs-keyword">switch</span> = <span class="hljs-string">&#x27;switch&#x27;</span><br>&#125;<br><br><span class="hljs-comment">//按钮操作类型</span><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">enum</span> BUTTON_ACTION_TYPES &#123;<br>    add = <span class="hljs-string">&#x27;add&#x27;</span>,<br>    update = <span class="hljs-string">&#x27;update&#x27;</span>,<br>    delete = <span class="hljs-string">&#x27;delete&#x27;</span>,<br>    refresh = <span class="hljs-string">&#x27;refresh&#x27;</span><br>&#125;<br><br><span class="hljs-comment">//按钮类型</span><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">enum</span> BUTTON_TYPES &#123;<br>    <span class="hljs-keyword">default</span> = <span class="hljs-string">&#x27;default&#x27;</span>,<br>    primary = <span class="hljs-string">&#x27;primary&#x27;</span>,<br>&#125;<br><br><span class="hljs-comment">//方法类型</span><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">enum</span> METHOD_TYPES &#123;<br>    DELETE = <span class="hljs-string">&#x27;DELETE&#x27;</span>,<br>    POST = <span class="hljs-string">&#x27;POST&#x27;</span>,<br>    PUT = <span class="hljs-string">&#x27;PUT&#x27;</span>,<br>    GET = <span class="hljs-string">&#x27;GET&#x27;</span><br>&#125;<br><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">const</span> FIELD = [<br>    &#123; label: <span class="hljs-string">&#x27;文本&#x27;</span>, value: FIELD_TYPES.text &#125;,<br>    &#123; label: <span class="hljs-string">&#x27;数字&#x27;</span>, value: FIELD_TYPES.number &#125;,<br>    &#123; label: <span class="hljs-string">&#x27;下拉框&#x27;</span>, value: FIELD_TYPES.select &#125;,<br>    &#123; label: <span class="hljs-string">&#x27;日期时间&#x27;</span>, value: FIELD_TYPES.datetime &#125;,<br>    &#123; label: <span class="hljs-string">&#x27;开关&#x27;</span>, value: FIELD_TYPES.<span class="hljs-keyword">switch</span> &#125;<br>]<br><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">const</span> BUTTON = [<br>    &#123; label: <span class="hljs-string">&#x27;默认&#x27;</span>, value: BUTTON_TYPES.<span class="hljs-keyword">default</span> &#125;,<br>    &#123; label: <span class="hljs-string">&#x27;主要&#x27;</span>, value: BUTTON_TYPES.primary &#125;<br>]<br><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">const</span> BUTTON_ACTION = [<br>    &#123; label: <span class="hljs-string">&#x27;添加&#x27;</span>, value: BUTTON_ACTION_TYPES.add &#125;,<br>    &#123; label: <span class="hljs-string">&#x27;更新&#x27;</span>, value: BUTTON_ACTION_TYPES.update &#125;,<br>    &#123; label: <span class="hljs-string">&#x27;删除&#x27;</span>, value: BUTTON_ACTION_TYPES.delete &#125;,<br>    &#123; label: <span class="hljs-string">&#x27;刷新&#x27;</span>, value: BUTTON_ACTION_TYPES.refresh &#125;<br>]<br><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">const</span> METHOD = [<br>    &#123; label: <span class="hljs-string">&#x27;DELETE&#x27;</span>, value: METHOD_TYPES.DELETE &#125;,<br>    &#123; label: <span class="hljs-string">&#x27;POST&#x27;</span>, value: METHOD_TYPES.POST &#125;,<br>    &#123; label: <span class="hljs-string">&#x27;PUT&#x27;</span>, value: METHOD_TYPES.PUT &#125;,<br>    &#123; label: <span class="hljs-string">&#x27;GET&#x27;</span>, value: METHOD_TYPES.GET &#125;<br>]<br><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">const</span> BOOLEAN = [<br>    &#123; label: <span class="hljs-string">&#x27;是&#x27;</span>, value: <span class="hljs-number">1</span> &#125;,<br>    &#123; label: <span class="hljs-string">&#x27;否&#x27;</span>, value: <span class="hljs-number">0</span> &#125;<br>]<br><br></code></pre></td></tr></table></div></figure>

<h3 id="5-3-EntityEdit-index-tsx"><a href="#5-3-EntityEdit-index-tsx" class="headerlink" title="5.3 EntityEdit\index.tsx"></a>5.3 EntityEdit\index.tsx</h3><p>src\pages\EntityEdit\index.tsx</p>
<figure class="highlight handlebars"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-oac2dblacl5vp2"></i><span>handlebars</span><div class="collapse show" id="collapse-oac2dblacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br><span class="line">75</span><br><span class="line">76</span><br><span class="line">77</span><br><span class="line">78</span><br><span class="line">79</span><br><span class="line">80</span><br><span class="line">81</span><br><span class="line">82</span><br><span class="line">83</span><br><span class="line">84</span><br><span class="line">85</span><br><span class="line">86</span><br><span class="line">87</span><br><span class="line">88</span><br><span class="line">89</span><br><span class="line">90</span><br><span class="line">91</span><br><span class="line">92</span><br><span class="line">93</span><br><span class="line">94</span><br><span class="line">95</span><br><span class="line">96</span><br><span class="line">97</span><br><span class="line">98</span><br><span class="line">99</span><br><span class="line">100</span><br><span class="line">101</span><br><span class="line">102</span><br><span class="line">103</span><br><span class="line">104</span><br><span class="line">105</span><br><span class="line">106</span><br><span class="line">107</span><br><span class="line">108</span><br><span class="line">109</span><br><span class="line">110</span><br><span class="line">111</span><br><span class="line">112</span><br><span class="line">113</span><br><span class="line">114</span><br><span class="line">115</span><br><span class="line">116</span><br><span class="line">117</span><br><span class="line">118</span><br><span class="line">119</span><br><span class="line">120</span><br><span class="line">121</span><br><span class="line">122</span><br><span class="line">123</span><br><span class="line">124</span><br><span class="line">125</span><br><span class="line">126</span><br><span class="line">127</span><br><span class="line">128</span><br><span class="line">129</span><br><span class="line">130</span><br><span class="line">131</span><br><span class="line">132</span><br><span class="line">133</span><br><span class="line">134</span><br><span class="line">135</span><br><span class="line">136</span><br><span class="line">137</span><br><span class="line">138</span><br><span class="line">139</span><br><span class="line">140</span><br><span class="line">141</span><br><span class="line">142</span><br><span class="line">143</span><br><span class="line">144</span><br><span class="line">145</span><br><span class="line">146</span><br><span class="line">147</span><br><span class="line">148</span><br><span class="line">149</span><br><span class="line">150</span><br><span class="line">151</span><br><span class="line">152</span><br><span class="line">153</span><br><span class="line">154</span><br><span class="line">155</span><br><span class="line">156</span><br><span class="line">157</span><br><span class="line">158</span><br><span class="line">159</span><br><span class="line">160</span><br><span class="line">161</span><br><span class="line">162</span><br><span class="line">163</span><br><span class="line">164</span><br><span class="line">165</span><br><span class="line">166</span><br><span class="line">167</span><br><span class="line">168</span><br><span class="line">169</span><br><span class="line">170</span><br><span class="line">171</span><br><span class="line">172</span><br><span class="line">173</span><br><span class="line">174</span><br><span class="line">175</span><br><span class="line">176</span><br><span class="line">177</span><br><span class="line">178</span><br><span class="line">179</span><br><span class="line">180</span><br><span class="line">181</span><br><span class="line">182</span><br><span class="line">183</span><br><span class="line">184</span><br><span class="line">185</span><br><span class="line">186</span><br><span class="line">187</span><br><span class="line">188</span><br><span class="line">189</span><br><span class="line">190</span><br><span class="line">191</span><br><span class="line">192</span><br><span class="line">193</span><br><span class="line">194</span><br><span class="line">195</span><br><span class="line">196</span><br><span class="line">197</span><br><span class="line">198</span><br><span class="line">199</span><br><span class="line">200</span><br><span class="line">201</span><br><span class="line">202</span><br><span class="line">203</span><br><span class="line">204</span><br><span class="line">205</span><br><span class="line">206</span><br><span class="line">207</span><br><span class="line">208</span><br><span class="line">209</span><br><span class="line">210</span><br><span class="line">211</span><br><span class="line">212</span><br><span class="line">213</span><br><span class="line">214</span><br><span class="line">215</span><br><span class="line">216</span><br><span class="line">217</span><br><span class="line">218</span><br><span class="line">219</span><br><span class="line">220</span><br><span class="line">221</span><br><span class="line">222</span><br><span class="line">223</span><br><span class="line">224</span><br><span class="line">225</span><br><span class="line">226</span><br><span class="line">227</span><br><span class="line">228</span><br><span class="line">229</span><br><span class="line">230</span><br><span class="line">231</span><br><span class="line">232</span><br><span class="line">233</span><br><span class="line">234</span><br><span class="line">235</span><br><span class="line">236</span><br><span class="line">237</span><br><span class="line">238</span><br><span class="line">239</span><br><span class="line">240</span><br><span class="line">241</span><br><span class="line">242</span><br><span class="line">243</span><br><span class="line">244</span><br><span class="line">245</span><br><span class="line">246</span><br><span class="line">247</span><br><span class="line">248</span><br><span class="line">249</span><br><span class="line">250</span><br><span class="line">251</span><br><span class="line">252</span><br><span class="line">253</span><br><span class="line">254</span><br><span class="line">255</span><br><span class="line">256</span><br><span class="line">257</span><br><span class="line">258</span><br><span class="line">259</span><br><span class="line">260</span><br><span class="line">261</span><br><span class="line">262</span><br><span class="line">263</span><br><span class="line">264</span><br><span class="line">265</span><br><span class="line">266</span><br><span class="line">267</span><br><span class="line">268</span><br><span class="line">269</span><br><span class="line">270</span><br><span class="line">271</span><br><span class="line">272</span><br><span class="line">273</span><br><span class="line">274</span><br><span class="line">275</span><br><span class="line">276</span><br><span class="line">277</span><br><span class="line">278</span><br><span class="line">279</span><br><span class="line">280</span><br><span class="line">281</span><br><span class="line">282</span><br><span class="line">283</span><br><span class="line">284</span><br><span class="line">285</span><br><span class="line">286</span><br><span class="line">287</span><br><span class="line">288</span><br><span class="line">289</span><br><span class="line">290</span><br><span class="line">291</span><br><span class="line">292</span><br><span class="line">293</span><br><span class="line">294</span><br><span class="line">295</span><br><span class="line">296</span><br><span class="line">297</span><br><span class="line">298</span><br><span class="line">299</span><br><span class="line">300</span><br><span class="line">301</span><br><span class="line">302</span><br><span class="line">303</span><br><span class="line">304</span><br><span class="line">305</span><br><span class="line">306</span><br><span class="line">307</span><br><span class="line">308</span><br><span class="line">309</span><br><span class="line">310</span><br><span class="line">311</span><br><span class="line">312</span><br><span class="line">313</span><br><span class="line">314</span><br><span class="line">315</span><br><span class="line">316</span><br><span class="line">317</span><br><span class="line">318</span><br><span class="line">319</span><br><span class="line">320</span><br><span class="line">321</span><br><span class="line">322</span><br><span class="line">323</span><br><span class="line">324</span><br><span class="line">325</span><br><span class="line">326</span><br><span class="line">327</span><br><span class="line">328</span><br><span class="line">329</span><br><span class="line">330</span><br><span class="line">331</span><br><span class="line">332</span><br><span class="line">333</span><br><span class="line">334</span><br><span class="line">335</span><br><span class="line">336</span><br><span class="line">337</span><br><span class="line">338</span><br><span class="line">339</span><br><span class="line">340</span><br><span class="line">341</span><br><span class="line">342</span><br><span class="line">343</span><br><span class="line">344</span><br><span class="line">345</span><br><span class="line">346</span><br><span class="line">347</span><br><span class="line">348</span><br><span class="line">349</span><br><span class="line">350</span><br><span class="line">351</span><br><span class="line">352</span><br><span class="line">353</span><br><span class="line">354</span><br><span class="line">355</span><br><span class="line">356</span><br><span class="line">357</span><br><span class="line">358</span><br><span class="line">359</span><br><span class="line">360</span><br><span class="line">361</span><br><span class="line">362</span><br><span class="line">363</span><br><span class="line">364</span><br><span class="line">365</span><br><span class="line">366</span><br><span class="line">367</span><br><span class="line">368</span><br><span class="line">369</span><br><span class="line">370</span><br><span class="line">371</span><br><span class="line">372</span><br><span class="line">373</span><br><span class="line">374</span><br><span class="line">375</span><br><span class="line">376</span><br><span class="line">377</span><br><span class="line">378</span><br><span class="line">379</span><br><span class="line">380</span><br><span class="line">381</span><br><span class="line">382</span><br><span class="line">383</span><br><span class="line">384</span><br><span class="line">385</span><br><span class="line">386</span><br><span class="line">387</span><br><span class="line">388</span><br><span class="line">389</span><br><span class="line">390</span><br><span class="line">391</span><br><span class="line">392</span><br><span class="line">393</span><br><span class="line">394</span><br><span class="line">395</span><br><span class="line">396</span><br><span class="line">397</span><br><span class="line">398</span><br><span class="line">399</span><br><span class="line">400</span><br><span class="line">401</span><br><span class="line">402</span><br><span class="line">403</span><br><span class="line">404</span><br><span class="line">405</span><br><span class="line">406</span><br><span class="line">407</span><br><span class="line">408</span><br><span class="line">409</span><br><span class="line">410</span><br><span class="line">411</span><br><span class="line">412</span><br><span class="line">413</span><br><span class="line">414</span><br><span class="line">415</span><br><span class="line">416</span><br><span class="line">417</span><br><span class="line">418</span><br><span class="line">419</span><br><span class="line">420</span><br><span class="line">421</span><br><span class="line">422</span><br><span class="line">423</span><br><span class="line">424</span><br><span class="line">425</span><br><span class="line">426</span><br><span class="line">427</span><br><span class="line">428</span><br><span class="line">429</span><br><span class="line">430</span><br><span class="line">431</span><br><span class="line">432</span><br><span class="line">433</span><br><span class="line">434</span><br><span class="line">435</span><br><span class="line">436</span><br><span class="line">437</span><br><span class="line">438</span><br><span class="line">439</span><br><span class="line">440</span><br><span class="line">441</span><br><span class="line">442</span><br><span class="line">443</span><br><span class="line">444</span><br><span class="line">445</span><br><span class="line">446</span><br><span class="line">447</span><br><span class="line">448</span><br><span class="line">449</span><br><span class="line">450</span><br><span class="line">451</span><br><span class="line">452</span><br><span class="line">453</span><br><span class="line">454</span><br><span class="line">455</span><br><span class="line">456</span><br><span class="line">457</span><br><span class="line">458</span><br><span class="line">459</span><br><span class="line">460</span><br><span class="line">461</span><br><span class="line">462</span><br><span class="line">463</span><br><span class="line">464</span><br><span class="line">465</span><br><span class="line">466</span><br><span class="line">467</span><br><span class="line">468</span><br><span class="line">469</span><br><span class="line">470</span><br><span class="line">471</span><br><span class="line">472</span><br><span class="line">473</span><br><span class="line">474</span><br><span class="line">475</span><br><span class="line">476</span><br><span class="line">477</span><br><span class="line">478</span><br><span class="line">479</span><br><span class="line">480</span><br><span class="line">481</span><br><span class="line">482</span><br><span class="line">483</span><br><span class="line">484</span><br><span class="line">485</span><br><span class="line">486</span><br><span class="line">487</span><br><span class="line">488</span><br><span class="line">489</span><br><span class="line">490</span><br><span class="line">491</span><br><span class="line">492</span><br><span class="line">493</span><br><span class="line">494</span><br><span class="line">495</span><br><span class="line">496</span><br><span class="line">497</span><br><span class="line">498</span><br><span class="line">499</span><br><span class="line">500</span><br><span class="line">501</span><br><span class="line">502</span><br><span class="line">503</span><br><span class="line">504</span><br><span class="line">505</span><br><span class="line">506</span><br><span class="line">507</span><br><span class="line">508</span><br><span class="line">509</span><br><span class="line">510</span><br><span class="line">511</span><br><span class="line">512</span><br><span class="line">513</span><br><span class="line">514</span><br><span class="line">515</span><br><span class="line">516</span><br><span class="line">517</span><br><span class="line">518</span><br><span class="line">519</span><br><span class="line">520</span><br><span class="line">521</span><br><span class="line">522</span><br><span class="line">523</span><br><span class="line">524</span><br><span class="line">525</span><br><span class="line">526</span><br><span class="line">527</span><br><span class="line">528</span><br><span class="line">529</span><br><span class="line">530</span><br><span class="line">531</span><br><span class="line">532</span><br><span class="line">533</span><br><span class="line">534</span><br><span class="line">535</span><br><span class="line">536</span><br><span class="line">537</span><br><span class="line">538</span><br><span class="line">539</span><br><span class="line">540</span><br><span class="line">541</span><br><span class="line">542</span><br><span class="line">543</span><br><span class="line">544</span><br><span class="line">545</span><br><span class="line">546</span><br><span class="line">547</span><br><span class="line">548</span><br><span class="line">549</span><br><span class="line">550</span><br><span class="line">551</span><br><span class="line">552</span><br><span class="line">553</span><br><span class="line">554</span><br><span class="line">555</span><br><span class="line">556</span><br><span class="line">557</span><br><span class="line">558</span><br><span class="line">559</span><br><span class="line">560</span><br><span class="line">561</span><br><span class="line">562</span><br><span class="line">563</span><br><span class="line">564</span><br><span class="line">565</span><br><span class="line">566</span><br><span class="line">567</span><br><span class="line">568</span><br><span class="line">569</span><br><span class="line">570</span><br><span class="line">571</span><br><span class="line">572</span><br><span class="line">573</span><br><span class="line">574</span><br><span class="line">575</span><br><span class="line">576</span><br><span class="line">577</span><br><span class="line">578</span><br><span class="line">579</span><br><span class="line">580</span><br><span class="line">581</span><br><span class="line">582</span><br><span class="line">583</span><br><span class="line">584</span><br><span class="line">585</span><br><span class="line">586</span><br><span class="line">587</span><br><span class="line">588</span><br><span class="line">589</span><br><span class="line">590</span><br><span class="line">591</span><br><span class="line">592</span><br><span class="line">593</span><br><span class="line">594</span><br><span class="line">595</span><br><span class="line">596</span><br><span class="line">597</span><br><span class="line">598</span><br><span class="line">599</span><br><span class="line">600</span><br><span class="line">601</span><br><span class="line">602</span><br><span class="line">603</span><br><span class="line">604</span><br><span class="line">605</span><br><span class="line">606</span><br><span class="line">607</span><br><span class="line">608</span><br><span class="line">609</span><br><span class="line">610</span><br><span class="line">611</span><br><span class="line">612</span><br><span class="line">613</span><br><span class="line">614</span><br><span class="line">615</span><br><span class="line">616</span><br><span class="line">617</span><br><span class="line">618</span><br><span class="line">619</span><br><span class="line">620</span><br><span class="line">621</span><br><span class="line">622</span><br><span class="line">623</span><br><span class="line">624</span><br><span class="line">625</span><br><span class="line">626</span><br><span class="line">627</span><br><span class="line">628</span><br><span class="line">629</span><br><span class="line">630</span><br><span class="line">631</span><br><span class="line">632</span><br><span class="line">633</span><br><span class="line">634</span><br><span class="line">635</span><br><span class="line">636</span><br><span class="line">637</span><br><span class="line">638</span><br><span class="line">639</span><br><span class="line">640</span><br><span class="line">641</span><br><span class="line">642</span><br></pre></td><td class="code"><pre><code class="hljs handlebars"><span class="language-xml">import &#123; Card, message, List &#125; from &#x27;antd&#x27;</span><br><span class="language-xml">import &#123;</span><br><span class="language-xml">  FormItem, Input, ArrayTable, Editable, FormButtonGroup, Submit, Select, Checkbox, Switch,</span><br><span class="language-xml">  FormLayout, FormGrid,</span><br><span class="language-xml">&#125; from &#x27;@formily/antd&#x27;</span><br><span class="language-xml">import &#123; createForm, onFormValidateFailed &#125; from &#x27;@formily/core&#x27;</span><br><span class="language-xml">import &#123; FormProvider, createSchemaField &#125; from &#x27;@formily/react&#x27;</span><br><span class="language-xml">import &#123; onFieldValueChange, FormPath &#125; from &#x27;@formily/core&#x27;;</span><br><span class="language-xml">import &#123; PageContainer &#125; from &#x27;@ant-design/pro-components&#x27;;</span><br><span class="language-xml">import &#123; request, useRequest, history, useLocation &#125; from &#x27;umi&#x27;;</span><br><span class="language-xml">import Qs from &#x27;query-string&#x27;;</span><br><span class="language-xml">import &#123; FIELD, BUTTON_ACTION, BUTTON, METHOD, BUTTON_ACTION_TYPES &#125; from &#x27;@/constants/enums&#x27;;</span><br><span class="language-xml">import &#123; initialEntityValues &#125; from &#x27;./initialValues&#x27;;</span><br><span class="language-xml">import &#123; useMount &#125; from &#x27;ahooks&#x27;;</span><br><span class="language-xml">const &#123; parse &#125; = FormPath;</span><br><span class="language-xml">const SchemaField = createSchemaField(&#123;</span><br><span class="language-xml">  components: &#123;</span><br><span class="language-xml">    FormItem,</span><br><span class="language-xml">    Editable,</span><br><span class="language-xml">    Input,</span><br><span class="language-xml">    ArrayTable,</span><br><span class="language-xml">    Select,</span><br><span class="language-xml">    Checkbox,</span><br><span class="language-xml">    Switch,</span><br><span class="language-xml">    FormLayout,</span><br><span class="language-xml">    Card,</span><br><span class="language-xml">    FormGrid</span><br><span class="language-xml">  &#125;,</span><br><span class="language-xml">&#125;)</span><br><span class="language-xml"></span><br><span class="language-xml">const form = createForm(&#123;</span><br><span class="language-xml">  effects(form) &#123;</span><br><span class="language-xml">    onFieldValueChange(&#x27;name&#x27;, (&#123; value &#125;) =&gt; &#123;</span><br><span class="language-xml">      form.setFieldState(&#x27;*(page.*.data,record.*.data)&#x27;, (state: any) =&gt; &#123;</span><br><span class="language-xml">        let dataValue = form.getValuesIn(state.address.entire);</span><br><span class="language-xml">        for (let item of dataValue) &#123;</span><br><span class="language-xml">          if (item.name === &#x27;url&#x27;) &#123;</span><br><span class="language-xml">            let action = form.getValuesIn(parse(&#x27;.action&#x27;, state.address.entire).entire);</span><br><span class="language-xml">            item.value = getUrl(action, value)</span><br><span class="language-xml">          &#125;</span><br><span class="language-xml">        &#125;</span><br><span class="language-xml">        function getUrl(action, value) &#123;</span><br><span class="language-xml">          switch (action) &#123;</span><br><span class="language-xml">            case BUTTON_ACTION_TYPES.add:</span><br><span class="language-xml">              return `/api/$&#123;value&#125;`;</span><br><span class="language-xml">            case BUTTON_ACTION_TYPES.update:</span><br><span class="language-xml">              return `/api/$&#123;value&#125;/:id`;</span><br><span class="language-xml">            case BUTTON_ACTION_TYPES.delete:</span><br><span class="language-xml">              return `/api/$&#123;value&#125;/:id`;</span><br><span class="language-xml">            default:</span><br><span class="language-xml">              break;</span><br><span class="language-xml">          &#125;</span><br><span class="language-xml">        &#125;</span><br><span class="language-xml">      &#125;);</span><br><span class="language-xml">    &#125;)</span><br><span class="language-xml">    onFormValidateFailed((form) =&gt; &#123;</span><br><span class="language-xml">      message.error(<span class="hljs-tag">&lt;<span class="hljs-name">List</span></span></span><br><span class="hljs-tag"><span class="language-xml">        <span class="hljs-attr">bordered</span></span></span><br><span class="hljs-tag"><span class="language-xml">        <span class="hljs-attr">dataSource</span>=<span class="hljs-string">&#123;form.errors.map(error</span> =&gt;</span> `$&#123;error.address&#125; $&#123;error.messages.join(&#x27;,&#x27;)&#125;`)&#125;</span><br><span class="language-xml">        renderItem=&#123;(item: any) =&gt; (</span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">List.Item</span>&gt;</span>&#123;item&#125;<span class="hljs-tag">&lt;/<span class="hljs-name">List.Item</span>&gt;</span></span><br><span class="language-xml">        )&#125;</span><br><span class="language-xml">      /&gt;);</span><br><span class="language-xml">    &#125;)</span><br><span class="language-xml">  &#125;</span><br><span class="language-xml">&#125;)</span><br><span class="language-xml"></span><br><span class="language-xml">export default function () &#123;</span><br><span class="language-xml">  const location = useLocation();</span><br><span class="language-xml">  const query = Qs.parse(location.search);</span><br><span class="language-xml">  const loadQuery = useRequest((id) =&gt;</span><br><span class="language-xml">    request(`/api/entity/$&#123;id&#125;`, &#123;</span><br><span class="language-xml">      method: &#x27;GET&#x27;</span><br><span class="language-xml">    &#125;), &#123;</span><br><span class="language-xml">    manual: true,</span><br><span class="language-xml">    onSuccess(data: any) &#123;</span><br><span class="language-xml">      form.setValues(data);</span><br><span class="language-xml">    &#125;</span><br><span class="language-xml">  &#125;);</span><br><span class="language-xml">  useMount(() =&gt; &#123;</span><br><span class="language-xml">    if (query.id) &#123;</span><br><span class="language-xml">      loadQuery.run(query.id);</span><br><span class="language-xml">    &#125; else &#123;</span><br><span class="language-xml">      form.setValues(initialEntityValues);</span><br><span class="language-xml">    &#125;</span><br><span class="language-xml">  &#125;);</span><br><span class="language-xml">  const addQuery = useRequest((values) =&gt;</span><br><span class="language-xml">    request(`/api/entity`, &#123;</span><br><span class="language-xml">      method: &#x27;POST&#x27;,</span><br><span class="language-xml">      data: values</span><br><span class="language-xml">    &#125;), &#123;</span><br><span class="language-xml">    manual: true,</span><br><span class="language-xml">    onSuccess() &#123;</span><br><span class="language-xml">      history.back();</span><br><span class="language-xml">    &#125;,</span><br><span class="language-xml">    formatResult(res) &#123;</span><br><span class="language-xml">      return res;</span><br><span class="language-xml">    &#125;</span><br><span class="language-xml">  &#125;);</span><br><span class="language-xml">  const updateQuery = useRequest((id, values) =&gt;</span><br><span class="language-xml">    request(`/api/entity/$&#123;id&#125;`, &#123;</span><br><span class="language-xml">      method: &#x27;PUT&#x27;,</span><br><span class="language-xml">      data: values</span><br><span class="language-xml">    &#125;), &#123;</span><br><span class="language-xml">    manual: true,</span><br><span class="language-xml">    onSuccess() &#123;</span><br><span class="language-xml">      history.back();</span><br><span class="language-xml">    &#125;,</span><br><span class="language-xml">    formatResult(res) &#123;</span><br><span class="language-xml">      return res;</span><br><span class="language-xml">    &#125;</span><br><span class="language-xml">  &#125;);</span><br><span class="language-xml">  const handleSubmit = (values) =&gt; &#123;</span><br><span class="language-xml">    console.log(&#x27;values&#x27;, values);</span><br><span class="language-xml">    if (query.id) &#123;</span><br><span class="language-xml">      updateQuery.run(query.id, values);</span><br><span class="language-xml">    &#125; else &#123;</span><br><span class="language-xml">      addQuery.run(values);</span><br><span class="language-xml">    &#125;</span><br><span class="language-xml"></span><br><span class="language-xml">  &#125;</span><br><span class="language-xml">  return (</span><br><span class="language-xml">    <span class="hljs-tag">&lt;<span class="hljs-name">PageContainer</span>&gt;</span></span><br><span class="language-xml">      <span class="hljs-tag">&lt;<span class="hljs-name">FormProvider</span> <span class="hljs-attr">form</span>=<span class="hljs-string">&#123;form&#125;</span>&gt;</span></span><br><span class="language-xml">        <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;FormGrid&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">maxColumns:</span> <span class="hljs-number">4</span>, minColumns: <span class="hljs-number">2</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">          &gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;name&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;名称&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Input&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            /&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;title&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;标题&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Input&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            /&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Array</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;fields&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">          &gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Object</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">width:</span> <span class="hljs-number">50</span>, title: <span class="hljs-string">&#x27;排序&#x27;</span>, align: <span class="hljs-string">&#x27;center&#x27;</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.SortHandle&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">width:</span> <span class="hljs-number">80</span>, title: <span class="hljs-string">&#x27;索引&#x27;</span>, align: <span class="hljs-string">&#x27;center&#x27;</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Index&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;名称&#x27;</span>, dataIndex: <span class="hljs-string">&#x27;name&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;name&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Input&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;标题&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;title&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Input&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;类型&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;type&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Select&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">enum</span>=<span class="hljs-string">&#123;FIELD&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;数据&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Array</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;data&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;配置字段数据&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;Editable.Popover&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-reactions</span>=<span class="hljs-string">&#123;(field:</span> <span class="hljs-attr">any</span>) =&gt;</span> &#123;</span><br><span class="language-xml">                    let value = field.getState().value;</span><br><span class="language-xml">                    if (value.length &gt; 0) &#123;</span><br><span class="language-xml">                      field.title = value.map(item =&gt; item.title).join(&#x27;,&#x27;);</span><br><span class="language-xml">                    &#125;</span><br><span class="language-xml">                  &#125;&#125;</span><br><span class="language-xml">                &gt;</span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Object</span>&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;标题&#x27;</span>, dataIndex: <span class="hljs-string">&#x27;name&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">                    &gt;</span></span><br><span class="language-xml">                      <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;title&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Input&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      /&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;值&#x27;</span>, dataIndex: <span class="hljs-string">&#x27;value&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">                    &gt;</span></span><br><span class="language-xml">                      <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;value&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Input&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      /&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123;</span><br><span class="hljs-template-variable">                        <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;操作&#x27;</span>,</span><br><span class="hljs-template-variable">                        dataIndex: <span class="hljs-string">&#x27;operations&#x27;</span>,</span><br><span class="hljs-template-variable">                        width: <span class="hljs-number">200</span>,</span><br><span class="hljs-template-variable">                        fixed: <span class="hljs-string">&#x27;right&#x27;</span></span><br><span class="hljs-template-variable">                      &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">                    &gt;</span></span><br><span class="language-xml">                      <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;FormItem&quot;</span>&gt;</span></span><br><span class="language-xml">                        <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Remove&quot;</span> /&gt;</span></span><br><span class="language-xml">                        <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.MoveDown&quot;</span> /&gt;</span></span><br><span class="language-xml">                        <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.MoveUp&quot;</span> /&gt;</span></span><br><span class="language-xml">                      <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Object</span>&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Addition&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;添加字段配置&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  /&gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Array</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;支持排序&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;sorter&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Switch&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-reactions</span>=</span></span><span class="hljs-template-variable">&#123;&#123;</span><br><span class="hljs-template-variable">                    <span class="hljs-name">&quot;dependencies&quot;</span>: [&quot;.type&quot;],</span><br><span class="hljs-template-variable">                    when: <span class="hljs-string">&quot;&#123;&#123;$deps[0] === &#x27;number&#x27;&#125;&#125;&quot;</span>,</span><br><span class="hljs-template-variable">                    fulfill: &#123;</span><br><span class="hljs-template-variable">                      state: &#123;</span><br><span class="hljs-template-variable">                        value: <span class="hljs-literal">true</span></span><br><span class="hljs-template-variable">                      &#125;</span><br><span class="hljs-template-variable">                    &#125;,</span><br><span class="hljs-template-variable">                    otherwise: &#123;</span><br><span class="hljs-template-variable">                      state: &#123;</span><br><span class="hljs-template-variable">                        value: <span class="hljs-literal">false</span></span><br><span class="hljs-template-variable">                      &#125;</span><br><span class="hljs-template-variable">                    &#125;,</span><br><span class="hljs-template-variable">                  &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;列表隐藏&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;hideInColumn&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Switch&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;不允许编辑&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;disabled&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Switch&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123;</span><br><span class="hljs-template-variable">                  <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;操作&#x27;</span>,</span><br><span class="hljs-template-variable">                  dataIndex: <span class="hljs-string">&#x27;operations&#x27;</span>,</span><br><span class="hljs-template-variable">                  width: <span class="hljs-number">200</span>,</span><br><span class="hljs-template-variable">                  fixed: <span class="hljs-string">&#x27;right&#x27;</span></span><br><span class="hljs-template-variable">                &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;FormItem&quot;</span>&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Remove&quot;</span> /&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.MoveDown&quot;</span> /&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.MoveUp&quot;</span> /&gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Object</span>&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Addition&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;添加字段&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            /&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Array</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Array</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;page&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">          &gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Object</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">width:</span> <span class="hljs-number">50</span>, title: <span class="hljs-string">&#x27;排序&#x27;</span>, align: <span class="hljs-string">&#x27;center&#x27;</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.SortHandle&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">width:</span> <span class="hljs-number">80</span>, title: <span class="hljs-string">&#x27;索引&#x27;</span>, align: <span class="hljs-string">&#x27;center&#x27;</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Index&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;文本&#x27;</span>, dataIndex: <span class="hljs-string">&#x27;title&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;title&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;Editable&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Input&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;类型&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;type&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Select&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">enum</span>=<span class="hljs-string">&#123;BUTTON&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;操作&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;action&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Select&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">enum</span>=<span class="hljs-string">&#123;BUTTON_ACTION&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;地址&#x27;</span>, dataIndex: <span class="hljs-string">&#x27;url&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Array</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;data&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;配置按钮数据&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;Editable.Popover&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-reactions</span>=<span class="hljs-string">&#123;(field:</span> <span class="hljs-attr">any</span>) =&gt;</span> &#123;</span><br><span class="language-xml">                    let value = field.getState().value;</span><br><span class="language-xml">                    if (value.length &gt; 0) &#123;</span><br><span class="language-xml">                      field.title = &#x27;&#123;&#x27; + value.map(item =&gt; item.name).join(&#x27;,&#x27;) + &#x27;&#125;&#x27;;</span><br><span class="language-xml">                    &#125;</span><br><span class="language-xml">                  &#125;&#125;</span><br><span class="language-xml">                &gt;</span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Object</span>&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;属性1&#x27;</span>, dataIndex: <span class="hljs-string">&#x27;name&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">                    &gt;</span></span><br><span class="language-xml">                      <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;name&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Input&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      /&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;值&#x27;</span>, dataIndex: <span class="hljs-string">&#x27;value&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">                    &gt;</span></span><br><span class="language-xml">                      <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;value&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Input&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">x-reactions</span>=</span></span><span class="hljs-template-variable">&#123;&#123;</span><br><span class="hljs-template-variable">                          <span class="hljs-name">dependencies:</span> [&#x27;.name&#x27;],</span><br><span class="hljs-template-variable">                          when: <span class="hljs-string">&quot;&#123;&#123;$deps[0] === &#x27;method&#x27;&#125;&#125;&quot;</span>,</span><br><span class="hljs-template-variable">                          fulfill: &#123;</span><br><span class="hljs-template-variable">                            schema: &#123;</span><br><span class="hljs-template-variable">                              <span class="hljs-string">&#x27;x-component&#x27;</span>: <span class="hljs-string">&quot;Select&quot;</span>,</span><br><span class="hljs-template-variable">                              enum: METHOD</span><br><span class="hljs-template-variable">                            &#125;</span><br><span class="hljs-template-variable">                          &#125;,</span><br><span class="hljs-template-variable">                          otherwise: &#123;</span><br><span class="hljs-template-variable">                            schema: &#123;</span><br><span class="hljs-template-variable">                              <span class="hljs-string">&#x27;x-component&#x27;</span>: <span class="hljs-string">&quot;Input&quot;</span>,</span><br><span class="hljs-template-variable">                              enum: <span class="hljs-literal">null</span></span><br><span class="hljs-template-variable">                            &#125;,</span><br><span class="hljs-template-variable">                          &#125;,</span><br><span class="hljs-template-variable">                        &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">                      /&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123;</span><br><span class="hljs-template-variable">                        <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;操作&#x27;</span>,</span><br><span class="hljs-template-variable">                        dataIndex: <span class="hljs-string">&#x27;operations&#x27;</span>,</span><br><span class="hljs-template-variable">                        width: <span class="hljs-number">200</span>,</span><br><span class="hljs-template-variable">                        fixed: <span class="hljs-string">&#x27;right&#x27;</span></span><br><span class="hljs-template-variable">                      &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">                    &gt;</span></span><br><span class="language-xml">                      <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;FormItem&quot;</span>&gt;</span></span><br><span class="language-xml">                        <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Remove&quot;</span> /&gt;</span></span><br><span class="language-xml">                        <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.MoveDown&quot;</span> /&gt;</span></span><br><span class="language-xml">                        <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.MoveUp&quot;</span> /&gt;</span></span><br><span class="language-xml">                      <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Object</span>&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Addition&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;添加配置&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  /&gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Array</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123;</span><br><span class="hljs-template-variable">                  <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;操作&#x27;</span>,</span><br><span class="hljs-template-variable">                  dataIndex: <span class="hljs-string">&#x27;operations&#x27;</span>,</span><br><span class="hljs-template-variable">                  width: <span class="hljs-number">200</span>,</span><br><span class="hljs-template-variable">                  fixed: <span class="hljs-string">&#x27;right&#x27;</span></span><br><span class="hljs-template-variable">                &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;FormItem&quot;</span>&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Remove&quot;</span> /&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.MoveDown&quot;</span> /&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.MoveUp&quot;</span> /&gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Object</span>&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Addition&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;添加页面操作&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            /&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Array</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Array</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;record&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">          &gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Object</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">width:</span> <span class="hljs-number">50</span>, title: <span class="hljs-string">&#x27;排序&#x27;</span>, align: <span class="hljs-string">&#x27;center&#x27;</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.SortHandle&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">width:</span> <span class="hljs-number">80</span>, title: <span class="hljs-string">&#x27;索引&#x27;</span>, align: <span class="hljs-string">&#x27;center&#x27;</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Index&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;文本&#x27;</span>, dataIndex: <span class="hljs-string">&#x27;title&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;title&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;Editable&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Input&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;类型&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;type&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Select&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">enum</span>=<span class="hljs-string">&#123;BUTTON&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;操作&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;action&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Select&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">enum</span>=<span class="hljs-string">&#123;BUTTON_ACTION&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                /&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml"></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;数据&#x27;</span>, dataIndex: <span class="hljs-string">&#x27;data&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Array</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;data&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;配置数据&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;Editable.Popover&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  <span class="hljs-attr">x-reactions</span>=<span class="hljs-string">&#123;(field:</span> <span class="hljs-attr">any</span>) =&gt;</span> &#123;</span><br><span class="language-xml">                    let value = field.getState().value;</span><br><span class="language-xml">                    if (value.length &gt; 0) &#123;</span><br><span class="language-xml">                      field.title = &#x27;&#123;&#x27; + value.map(item =&gt; item.name).join(&#x27;,&#x27;) + &#x27;&#125;&#x27;;</span><br><span class="language-xml">                    &#125;</span><br><span class="language-xml">                  &#125;&#125;</span><br><span class="language-xml">                &gt;</span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Object</span>&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;属性&#x27;</span>, dataIndex: <span class="hljs-string">&#x27;name&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">                    &gt;</span></span><br><span class="language-xml">                      <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;name&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Input&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      /&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123; <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;值&#x27;</span>, dataIndex: <span class="hljs-string">&#x27;value&#x27;</span>, width: <span class="hljs-number">200</span> &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">                    &gt;</span></span><br><span class="language-xml">                      <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.String</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">name</span>=<span class="hljs-string">&quot;value&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">x-decorator</span>=<span class="hljs-string">&quot;FormItem&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">required</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;Input&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      /&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                      <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123;</span><br><span class="hljs-template-variable">                        <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;操作&#x27;</span>,</span><br><span class="hljs-template-variable">                        dataIndex: <span class="hljs-string">&#x27;operations&#x27;</span>,</span><br><span class="hljs-template-variable">                        width: <span class="hljs-number">200</span>,</span><br><span class="hljs-template-variable">                        fixed: <span class="hljs-string">&#x27;right&#x27;</span></span><br><span class="hljs-template-variable">                      &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">                    &gt;</span></span><br><span class="language-xml">                      <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;FormItem&quot;</span>&gt;</span></span><br><span class="language-xml">                        <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Remove&quot;</span> /&gt;</span></span><br><span class="language-xml">                        <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.MoveDown&quot;</span> /&gt;</span></span><br><span class="language-xml">                        <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.MoveUp&quot;</span> /&gt;</span></span><br><span class="language-xml">                      <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">                    <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Object</span>&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Addition&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                    <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;添加配置&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                  /&gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Array</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Column&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">x-component-props</span>=</span></span><span class="hljs-template-variable">&#123;&#123;</span><br><span class="hljs-template-variable">                  <span class="hljs-name">title:</span> <span class="hljs-string">&#x27;操作&#x27;</span>,</span><br><span class="hljs-template-variable">                  dataIndex: <span class="hljs-string">&#x27;operations&#x27;</span>,</span><br><span class="hljs-template-variable">                  width: <span class="hljs-number">200</span>,</span><br><span class="hljs-template-variable">                  fixed: <span class="hljs-string">&#x27;right&#x27;</span></span><br><span class="hljs-template-variable">                &#125;&#125;</span><span class="language-xml"><span class="hljs-tag"></span></span><br><span class="hljs-tag"><span class="language-xml">              &gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;FormItem&quot;</span>&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Remove&quot;</span> /&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.MoveDown&quot;</span> /&gt;</span></span><br><span class="language-xml">                  <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span> <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.MoveUp&quot;</span> /&gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Void</span>&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Object</span>&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">SchemaField.Void</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">x-component</span>=<span class="hljs-string">&quot;ArrayTable.Addition&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">title</span>=<span class="hljs-string">&quot;添加记录操作&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            /&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField.Array</span>&gt;</span></span><br><span class="language-xml">        <span class="hljs-tag">&lt;/<span class="hljs-name">SchemaField</span>&gt;</span></span><br><span class="language-xml">        <span class="hljs-tag">&lt;<span class="hljs-name">FormButtonGroup</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">Submit</span> <span class="hljs-attr">onSubmit</span>=<span class="hljs-string">&#123;handleSubmit&#125;</span>&gt;</span>提交<span class="hljs-tag">&lt;/<span class="hljs-name">Submit</span>&gt;</span></span><br><span class="language-xml">        <span class="hljs-tag">&lt;/<span class="hljs-name">FormButtonGroup</span>&gt;</span></span><br><span class="language-xml">      <span class="hljs-tag">&lt;/<span class="hljs-name">FormProvider</span>&gt;</span></span><br><span class="language-xml">    <span class="hljs-tag">&lt;/<span class="hljs-name">PageContainer</span>&gt;</span></span><br><span class="language-xml">  )</span><br><span class="language-xml">&#125;</span><br><span class="language-xml"></span><br></code></pre></td></tr></table></div></figure>

<h3 id="5-4-initialValues-ts"><a href="#5-4-initialValues-ts" class="headerlink" title="5.4 initialValues.ts"></a>5.4 initialValues.ts</h3><p>src\pages\EntityEdit\initialValues.ts</p>
<figure class="highlight pgsql"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-j0getrlacl5vp2"></i><span>pgsql</span><div class="collapse show" id="collapse-j0getrlacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br></pre></td><td class="code"><pre><code class="hljs pgsql"><span class="hljs-keyword">import</span> &#123; FIELD_TYPES, BUTTON_ACTION_TYPES, BUTTON_TYPES, METHOD_TYPES &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@/constants/enums&#x27;</span>;<br>export const initialEntityValues = &#123;<br>    <span class="hljs-type">name</span>: <span class="hljs-string">&#x27;user&#x27;</span>,<br>    title: <span class="hljs-string">&#x27;用户&#x27;</span>,<br>    fields: [<br>        &#123;<br>            disabled: <span class="hljs-number">0</span>,<br>            hideInColumn: <span class="hljs-number">0</span>,<br>            <span class="hljs-type">name</span>: &quot;name&quot;,<br>            sorter: <span class="hljs-number">0</span>,<br>            title: &quot;名称&quot;,<br>            <span class="hljs-keyword">type</span>: FIELD_TYPES.text<br>        &#125;],<br>    page: [<br>        &#123;<br>            action: BUTTON_ACTION_TYPES.<span class="hljs-keyword">add</span>,<br>            title: &quot;添加&quot;,<br>            <span class="hljs-keyword">type</span>: BUTTON_TYPES.<span class="hljs-keyword">primary</span>,<br>            data: [<br>                &#123; <span class="hljs-type">name</span>: <span class="hljs-string">&#x27;url&#x27;</span>, <span class="hljs-keyword">value</span>: <span class="hljs-string">&#x27;/api/user&#x27;</span> &#125;,<br>                &#123; <span class="hljs-type">name</span>: <span class="hljs-string">&#x27;method&#x27;</span>, <span class="hljs-keyword">value</span>: METHOD_TYPES.POST &#125;<br>            ]<br>        &#125;<br>    ],<br>    <span class="hljs-type">record</span>: [<br>        &#123;<br>            action: BUTTON_ACTION_TYPES.<span class="hljs-keyword">update</span>,<br>            title: &quot;更新&quot;,<br>            <span class="hljs-keyword">type</span>: BUTTON_TYPES.<span class="hljs-keyword">default</span>,<br>            data: [<br>                &#123; <span class="hljs-type">name</span>: <span class="hljs-string">&#x27;url&#x27;</span>, <span class="hljs-keyword">value</span>: <span class="hljs-string">&#x27;/api/user/:id&#x27;</span> &#125;,<br>                &#123; <span class="hljs-type">name</span>: <span class="hljs-string">&#x27;method&#x27;</span>, <span class="hljs-keyword">value</span>: METHOD_TYPES.PUT &#125;<br>            ]<br>        &#125;,<br>        &#123;<br>            action: BUTTON_ACTION_TYPES.<span class="hljs-keyword">delete</span>,<br>            title: &quot;删除&quot;,<br>            <span class="hljs-keyword">type</span>: BUTTON_TYPES.<span class="hljs-keyword">primary</span>,<br>            data: [<br>                &#123; <span class="hljs-type">name</span>: <span class="hljs-string">&#x27;url&#x27;</span>, <span class="hljs-keyword">value</span>: <span class="hljs-string">&#x27;/api/user/:id&#x27;</span> &#125;,<br>                &#123; <span class="hljs-type">name</span>: <span class="hljs-string">&#x27;method&#x27;</span>, <span class="hljs-keyword">value</span>: METHOD_TYPES.<span class="hljs-keyword">DELETE</span> &#125;<br>            ]<br>        &#125;<br>    ]<br><br>&#125;<br><br></code></pre></td></tr></table></div></figure>

<h2 id="6-查看实体"><a href="#6-查看实体" class="headerlink" title="6.查看实体 "></a>6.查看实体 </h2><h3 id="6-1-umirc-ts"><a href="#6-1-umirc-ts" class="headerlink" title="6.1 .umirc.ts"></a>6.1 .umirc.ts</h3><p>.umirc.ts</p>
<figure class="highlight markdown"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-lk440alacl5vp2"></i><span>markdown</span><div class="collapse show" id="collapse-lk440alacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><code class="hljs markdown"><span class="hljs-bullet">+</span>    &#123;<br><span class="hljs-bullet">+</span>      name: &#x27;实体&#x27;,<br><span class="hljs-bullet">+</span>      path: &#x27;/entity/view&#x27;,<br><span class="hljs-bullet">+</span>      component: &#x27;./EntityView&#x27;,<br><span class="hljs-bullet">+</span>    &#125;<br><br></code></pre></td></tr></table></div></figure>

<h3 id="6-2-src-pages-EntityView-index-tsx"><a href="#6-2-src-pages-EntityView-index-tsx" class="headerlink" title="6.2 src\pages\EntityView\index.tsx"></a>6.2 src\pages\EntityView\index.tsx</h3><p>src\pages\EntityView\index.tsx</p>
<figure class="highlight typescript"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-j07iuilacl5vp2"></i><span>typescript</span><div class="collapse show" id="collapse-j07iuilacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br><span class="line">75</span><br><span class="line">76</span><br><span class="line">77</span><br><span class="line">78</span><br><span class="line">79</span><br><span class="line">80</span><br><span class="line">81</span><br><span class="line">82</span><br><span class="line">83</span><br><span class="line">84</span><br><span class="line">85</span><br><span class="line">86</span><br><span class="line">87</span><br><span class="line">88</span><br><span class="line">89</span><br><span class="line">90</span><br><span class="line">91</span><br><span class="line">92</span><br><span class="line">93</span><br><span class="line">94</span><br><span class="line">95</span><br><span class="line">96</span><br><span class="line">97</span><br><span class="line">98</span><br><span class="line">99</span><br><span class="line">100</span><br><span class="line">101</span><br><span class="line">102</span><br><span class="line">103</span><br><span class="line">104</span><br><span class="line">105</span><br><span class="line">106</span><br><span class="line">107</span><br><span class="line">108</span><br><span class="line">109</span><br><span class="line">110</span><br><span class="line">111</span><br><span class="line">112</span><br><span class="line">113</span><br><span class="line">114</span><br><span class="line">115</span><br><span class="line">116</span><br><span class="line">117</span><br><span class="line">118</span><br><span class="line">119</span><br><span class="line">120</span><br><span class="line">121</span><br><span class="line">122</span><br><span class="line">123</span><br><span class="line">124</span><br><span class="line">125</span><br><span class="line">126</span><br><span class="line">127</span><br><span class="line">128</span><br><span class="line">129</span><br><span class="line">130</span><br><span class="line">131</span><br><span class="line">132</span><br><span class="line">133</span><br><span class="line">134</span><br><span class="line">135</span><br><span class="line">136</span><br><span class="line">137</span><br><span class="line">138</span><br><span class="line">139</span><br><span class="line">140</span><br><span class="line">141</span><br><span class="line">142</span><br><span class="line">143</span><br><span class="line">144</span><br><span class="line">145</span><br><span class="line">146</span><br><span class="line">147</span><br><span class="line">148</span><br><span class="line">149</span><br><span class="line">150</span><br><span class="line">151</span><br><span class="line">152</span><br><span class="line">153</span><br><span class="line">154</span><br><span class="line">155</span><br><span class="line">156</span><br><span class="line">157</span><br><span class="line">158</span><br><span class="line">159</span><br><span class="line">160</span><br><span class="line">161</span><br><span class="line">162</span><br><span class="line">163</span><br><span class="line">164</span><br><span class="line">165</span><br><span class="line">166</span><br><span class="line">167</span><br><span class="line">168</span><br><span class="line">169</span><br><span class="line">170</span><br><span class="line">171</span><br><span class="line">172</span><br><span class="line">173</span><br><span class="line">174</span><br><span class="line">175</span><br><span class="line">176</span><br><span class="line">177</span><br><span class="line">178</span><br><span class="line">179</span><br><span class="line">180</span><br><span class="line">181</span><br><span class="line">182</span><br><span class="line">183</span><br><span class="line">184</span><br><span class="line">185</span><br><span class="line">186</span><br><span class="line">187</span><br><span class="line">188</span><br><span class="line">189</span><br><span class="line">190</span><br><span class="line">191</span><br><span class="line">192</span><br><span class="line">193</span><br><span class="line">194</span><br><span class="line">195</span><br><span class="line">196</span><br><span class="line">197</span><br><span class="line">198</span><br></pre></td><td class="code"><pre><code class="hljs typescript"><span class="hljs-keyword">import</span> &#123; useState &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;react&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; <span class="hljs-title class_">Table</span>, <span class="hljs-title class_">Card</span>, <span class="hljs-title class_">Row</span>, <span class="hljs-title class_">Col</span>, <span class="hljs-title class_">Pagination</span>, <span class="hljs-title class_">Space</span>, <span class="hljs-title class_">Modal</span>, <span class="hljs-title class_">List</span>, message, <span class="hljs-title class_">Button</span> &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;antd&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; createForm &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@formily/core&#x27;</span><br><span class="hljs-keyword">import</span> &#123; <span class="hljs-title class_">Form</span>, <span class="hljs-title class_">Submit</span>, <span class="hljs-title class_">Reset</span>, <span class="hljs-title class_">FormButtonGroup</span> &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@formily/antd&#x27;</span><br><span class="hljs-keyword">import</span> &#123; <span class="hljs-title class_">FooterToolbar</span>, <span class="hljs-title class_">PageContainer</span> &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@ant-design/pro-components&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; request, useRequest, history, useLocation &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;umi&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; useToggle, useMount, useSetState &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;ahooks&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; <span class="hljs-title class_">ExclamationCircleOutlined</span>, <span class="hljs-title class_">SearchOutlined</span> &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@ant-design/icons&#x27;</span>;<br><span class="hljs-keyword">import</span> <span class="hljs-title class_">Qs</span> <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;query-string&#x27;</span>;<br><span class="hljs-keyword">import</span> <span class="hljs-title class_">EditModal</span> <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@/components/EditModal&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; renderColumns &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@/utils/render/column&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; <span class="hljs-variable constant_">BUTTON_ACTION_TYPES</span> &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@/constants/enums&#x27;</span><br><span class="hljs-keyword">import</span> &#123; formToValues &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@/utils/transformer/fieldValue&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; renderOperations &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@/utils/render/operation&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; renderSearchFields &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@/utils/render/field&#x27;</span>;<br><span class="hljs-keyword">const</span> searchForm = <span class="hljs-title function_">createForm</span>(&#123;<br>  <span class="hljs-attr">validateFirst</span>: <span class="hljs-literal">true</span>,<br>&#125;)<br><span class="hljs-keyword">const</span> <span class="hljs-title function_">Entity</span> = (<span class="hljs-params"></span>) =&gt; &#123;<br>  <span class="hljs-keyword">const</span> [&#123; current, pageSize &#125;, setPageConfig] = <span class="hljs-title function_">useState</span>(&#123; <span class="hljs-attr">current</span>: <span class="hljs-number">1</span>, <span class="hljs-attr">pageSize</span>: <span class="hljs-number">10</span> &#125;);<br>  <span class="hljs-keyword">const</span> [sorter, setSorter] = useState&lt;<span class="hljs-built_in">any</span>&gt;();<br>  <span class="hljs-keyword">const</span> [searchVisible, &#123; toggle &#125;] = <span class="hljs-title function_">useToggle</span>(<span class="hljs-literal">false</span>);<br>  <span class="hljs-keyword">const</span> [selectedRowKeys, setSelectedRowKeys] = <span class="hljs-title function_">useState</span>([]);<br>  <span class="hljs-keyword">const</span> [selectedRows, setSelectedRows] = <span class="hljs-title function_">useState</span>([]);<br>  <span class="hljs-keyword">const</span> location = <span class="hljs-title function_">useLocation</span>();<br>  <span class="hljs-keyword">const</span> query = <span class="hljs-title class_">Qs</span>.<span class="hljs-title function_">parse</span>(location.<span class="hljs-property">search</span>);<br>  <span class="hljs-keyword">const</span> [modalState, setModalState] = <span class="hljs-title function_">useSetState</span>(&#123; <span class="hljs-attr">visible</span>: <span class="hljs-literal">false</span>, <span class="hljs-attr">title</span>: <span class="hljs-string">&#x27;&#x27;</span>, <span class="hljs-attr">data</span>: [], <span class="hljs-attr">row</span>: &#123;&#125; &#125;);<br>  <span class="hljs-keyword">const</span> loadQuery = <span class="hljs-title function_">useRequest</span>(<span class="hljs-function">(<span class="hljs-params">params = &#123;&#125;</span>) =&gt;</span><br>    <span class="hljs-title function_">request</span>(<span class="hljs-string">`/api/<span class="hljs-subst">$&#123;query.name&#125;</span>`</span>, &#123;<br>      <span class="hljs-attr">params</span>: &#123;<br>        current,<br>        pageSize,<br>        <span class="hljs-attr">sort</span>: sorter?.<span class="hljs-property">field</span>,<br>        <span class="hljs-attr">order</span>: sorter?.<span class="hljs-property">order</span>?.<span class="hljs-title function_">slice</span>(<span class="hljs-number">0</span>, -<span class="hljs-number">3</span>),<br>        ...params<br>      &#125;,<br>      <span class="hljs-title function_">paramsSerializer</span>(<span class="hljs-params">params</span>) &#123;<br>        <span class="hljs-keyword">return</span> <span class="hljs-title class_">Qs</span>.<span class="hljs-title function_">stringify</span>(params, &#123; <span class="hljs-attr">arrayFormat</span>: <span class="hljs-string">&#x27;comma&#x27;</span>, <span class="hljs-attr">skipEmptyString</span>: <span class="hljs-literal">true</span>, <span class="hljs-attr">skipNull</span>: <span class="hljs-literal">true</span> &#125;)<br>      &#125;,<br>    &#125;), &#123;<br>    <span class="hljs-attr">refreshDeps</span>: [current, pageSize, sorter]<br>  &#125;);<br>  <span class="hljs-title function_">useMount</span>(<span class="hljs-function">() =&gt;</span> &#123;<br>    <span class="hljs-keyword">if</span> (query.<span class="hljs-property">id</span>) &#123;<br>      loadQuery.<span class="hljs-title function_">run</span>();<br>    &#125;<br>  &#125;);<br>  <span class="hljs-keyword">const</span> deleteQuery = <span class="hljs-title function_">useRequest</span>(<span class="hljs-function">(<span class="hljs-params">ids</span>) =&gt;</span><br>    <span class="hljs-title function_">request</span>(<span class="hljs-string">`/api/<span class="hljs-subst">$&#123;query.name&#125;</span>/<span class="hljs-subst">$&#123;ids[<span class="hljs-number">0</span>]&#125;</span>`</span>, &#123;<br>      <span class="hljs-attr">method</span>: <span class="hljs-string">&#x27;DELETE&#x27;</span>,<br>      <span class="hljs-attr">data</span>: ids<br>    &#125;), &#123;<br>    <span class="hljs-attr">manual</span>: <span class="hljs-literal">true</span>,<br>    <span class="hljs-title function_">onSuccess</span>(<span class="hljs-params">data</span>) &#123;<br>      message.<span class="hljs-title function_">success</span>(data.<span class="hljs-property">message</span>);<br>      loadQuery.<span class="hljs-title function_">refresh</span>();<br>    &#125;,<br>    <span class="hljs-title function_">formatResult</span>(<span class="hljs-params">res</span>) &#123;<br>      <span class="hljs-keyword">return</span> res;<br>    &#125;<br>  &#125;);<br>  <span class="hljs-keyword">const</span> <span class="hljs-title function_">deleteRecords</span> = (<span class="hljs-params">records</span>) =&gt; &#123;<br>    <span class="hljs-title class_">Modal</span>.<span class="hljs-title function_">confirm</span>(&#123;<br>      <span class="hljs-attr">title</span>: <span class="hljs-string">&#x27;确定删除以下记录吗?&#x27;</span>,<br>      <span class="hljs-attr">icon</span>: <span class="language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">ExclamationCircleOutlined</span> /&gt;</span></span>,<br>      <span class="hljs-attr">content</span>: (<br>        <span class="language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">List</span></span></span><br><span class="hljs-tag"><span class="language-xml">          <span class="hljs-attr">bordered</span></span></span><br><span class="hljs-tag"><span class="language-xml">          <span class="hljs-attr">dataSource</span>=<span class="hljs-string">&#123;records.map(record</span> =&gt;</span> record.name)&#125;</span><br><span class="language-xml">          renderItem=&#123;(item: any) =&gt; (</span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">List.Item</span>&gt;</span>&#123;item&#125;<span class="hljs-tag">&lt;/<span class="hljs-name">List.Item</span>&gt;</span></span><br><span class="language-xml">          )&#125;</span><br><span class="language-xml">        /&gt;</span><br>      ),<br>      <span class="hljs-attr">okText</span>: <span class="hljs-string">&#x27;是&#x27;</span>,<br>      <span class="hljs-attr">cancelText</span>: <span class="hljs-string">&#x27;否&#x27;</span>,<br>      <span class="hljs-attr">okType</span>: <span class="hljs-string">&#x27;danger&#x27;</span>,<br>      <span class="hljs-title function_">onOk</span>(<span class="hljs-params"></span>) &#123;<br>        <span class="hljs-keyword">return</span> deleteQuery.<span class="hljs-title function_">run</span>(records.<span class="hljs-title function_">map</span>(<span class="hljs-function"><span class="hljs-params">record</span> =&gt;</span> record.<span class="hljs-property">id</span>))<br>      &#125;<br>    &#125;);<br>  &#125;<br>  <span class="hljs-keyword">const</span> rowSelection = &#123;<br>    selectedRowKeys,<br>    <span class="hljs-attr">onChange</span>: <span class="hljs-function">(<span class="hljs-params">selectedRowKeys, selectedRows</span>) =&gt;</span> &#123;<br>      <span class="hljs-title function_">setSelectedRowKeys</span>(selectedRowKeys);<br>      <span class="hljs-title function_">setSelectedRows</span>(selectedRows);<br>    &#125;<br>  &#125;<br>  <span class="hljs-keyword">const</span> <span class="hljs-title function_">handleSubmit</span> = (<span class="hljs-params">values</span>) =&gt; &#123;<br>    loadQuery.<span class="hljs-title function_">run</span>(<span class="hljs-title function_">formToValues</span>(values));<br>  &#125;<br><br>  <span class="hljs-keyword">const</span> <span class="hljs-title function_">onAction</span> = (<span class="hljs-params">operation, row</span>) =&gt; &#123;<br>    <span class="hljs-keyword">switch</span> (operation.<span class="hljs-property">action</span>) &#123;<br>      <span class="hljs-keyword">case</span> <span class="hljs-variable constant_">BUTTON_ACTION_TYPES</span>.<span class="hljs-property">add</span>:<br>      <span class="hljs-keyword">case</span> <span class="hljs-variable constant_">BUTTON_ACTION_TYPES</span>.<span class="hljs-property">update</span>:<br>        <span class="hljs-title function_">setModalState</span>(&#123; <span class="hljs-attr">visible</span>: <span class="hljs-literal">true</span>, <span class="hljs-attr">title</span>: operation.<span class="hljs-property">title</span>, <span class="hljs-attr">data</span>: operation.<span class="hljs-property">data</span>, row &#125;)<br>        <span class="hljs-keyword">break</span>;<br>      <span class="hljs-keyword">case</span> <span class="hljs-variable constant_">BUTTON_ACTION_TYPES</span>.<span class="hljs-property">delete</span>:<br>        <span class="hljs-title function_">deleteRecords</span>([row]);<br>        <span class="hljs-keyword">break</span>;<br>      <span class="hljs-keyword">case</span> <span class="hljs-variable constant_">BUTTON_ACTION_TYPES</span>.<span class="hljs-property">refresh</span>:<br>        loadQuery.<span class="hljs-title function_">refresh</span>();<br>        <span class="hljs-keyword">break</span>;<br>      <span class="hljs-attr">default</span>:<br>        <span class="hljs-keyword">break</span>;<br>    &#125;<br>  &#125;<br>  <span class="hljs-keyword">return</span> (<br>    <span class="language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">PageContainer</span>&gt;</span></span><br><span class="language-xml">      &#123;</span><br><span class="language-xml">        searchVisible &amp;&amp; (</span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">Card</span> <span class="hljs-attr">key</span>=<span class="hljs-string">&quot;search&quot;</span>&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">Form</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">layout</span>=<span class="hljs-string">&quot;inline&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">form</span>=<span class="hljs-string">&#123;searchForm&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">onAutoSubmit</span>=<span class="hljs-string">&#123;handleSubmit&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            &gt;</span></span><br><span class="language-xml">              &#123;renderSearchFields(loadQuery.data?.fields)&#125;</span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">FormButtonGroup.FormItem</span>&gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">Submit</span>&gt;</span></span><br><span class="language-xml">                  查询</span><br><span class="language-xml">                <span class="hljs-tag">&lt;/<span class="hljs-name">Submit</span>&gt;</span></span><br><span class="language-xml">                <span class="hljs-tag">&lt;<span class="hljs-name">Reset</span> &gt;</span></span><br><span class="language-xml">                  重置</span><br><span class="language-xml">                <span class="hljs-tag">&lt;/<span class="hljs-name">Reset</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;/<span class="hljs-name">FormButtonGroup.FormItem</span>&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;/<span class="hljs-name">Form</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;/<span class="hljs-name">Card</span>&gt;</span></span><br><span class="language-xml">        )</span><br><span class="language-xml">      &#125;</span><br><span class="language-xml">      <span class="hljs-tag">&lt;<span class="hljs-name">Card</span>&gt;</span></span><br><span class="language-xml">        <span class="hljs-tag">&lt;<span class="hljs-name">Row</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">Col</span> <span class="hljs-attr">xs</span>=<span class="hljs-string">&#123;24&#125;</span> <span class="hljs-attr">style</span>=<span class="hljs-string">&#123;&#123;</span> <span class="hljs-attr">textAlign:</span> &#x27;<span class="hljs-attr">right</span>&#x27;, <span class="hljs-attr">padding:</span> &#x27;<span class="hljs-attr">10px</span>&#x27; &#125;&#125;&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">Space</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">Button</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">shape</span>=<span class="hljs-string">&#x27;circle&#x27;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">icon</span>=<span class="hljs-string">&#123;</span>&lt;<span class="hljs-attr">SearchOutlined</span> /&gt;</span>&#125;</span><br><span class="language-xml">                onClick=&#123;toggle&#125;</span><br><span class="language-xml">                type=&#123;searchVisible ? &#x27;primary&#x27; : &#x27;default&#x27;&#125;</span><br><span class="language-xml">              /&gt;</span><br><span class="language-xml">              &#123;renderOperations(loadQuery.data?.page, onAction)&#125;</span><br><span class="language-xml">            <span class="hljs-tag">&lt;/<span class="hljs-name">Space</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;/<span class="hljs-name">Col</span>&gt;</span></span><br><span class="language-xml">        <span class="hljs-tag">&lt;/<span class="hljs-name">Row</span>&gt;</span></span><br><span class="language-xml">        <span class="hljs-tag">&lt;<span class="hljs-name">Table</span></span></span><br><span class="hljs-tag"><span class="language-xml">          <span class="hljs-attr">dataSource</span>=<span class="hljs-string">&#123;loadQuery.data?.list&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">          <span class="hljs-attr">columns</span>=<span class="hljs-string">&#123;renderColumns(loadQuery.data,</span> <span class="hljs-attr">onAction</span>)&#125;</span></span><br><span class="hljs-tag"><span class="language-xml">          <span class="hljs-attr">loading</span>=<span class="hljs-string">&#123;loadQuery.loading&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">          <span class="hljs-attr">rowKey</span>=<span class="hljs-string">&#123;row</span> =&gt;</span> row.id&#125;</span><br><span class="language-xml">          pagination=&#123;false&#125;</span><br><span class="language-xml">          onChange=&#123;(_, __, sorter) =&gt; setSorter(sorter)&#125;</span><br><span class="language-xml">          rowSelection=&#123;rowSelection&#125;</span><br><span class="language-xml">        /&gt;</span><br><span class="language-xml">        <span class="hljs-tag">&lt;<span class="hljs-name">Row</span>&gt;</span></span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">Col</span> <span class="hljs-attr">xs</span>=<span class="hljs-string">&#123;24&#125;</span> <span class="hljs-attr">style</span>=<span class="hljs-string">&#123;&#123;</span> <span class="hljs-attr">textAlign:</span> &#x27;<span class="hljs-attr">right</span>&#x27;, <span class="hljs-attr">padding:</span> &#x27;<span class="hljs-attr">10px</span>&#x27; &#125;&#125;&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">Pagination</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">total</span>=<span class="hljs-string">&#123;loadQuery.data?.total</span> || <span class="hljs-attr">0</span>&#125;</span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">current</span>=<span class="hljs-string">&#123;loadQuery.data?.current</span> || <span class="hljs-attr">1</span>&#125;</span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">pageSize</span>=<span class="hljs-string">&#123;loadQuery.data?.pageSize</span> || <span class="hljs-attr">10</span>&#125;</span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">showSizeChanger</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">showQuickJumper</span></span></span><br><span class="hljs-tag"><span class="language-xml">              <span class="hljs-attr">showTotal</span>=<span class="hljs-string">&#123;total</span> =&gt;</span> `总计$&#123;total&#125;条`&#125;</span><br><span class="language-xml">              onChange=&#123;(current, pageSize) =&gt; setPageConfig(&#123; current, pageSize &#125;)&#125;</span><br><span class="language-xml">            /&gt;</span><br><span class="language-xml">          <span class="hljs-tag">&lt;/<span class="hljs-name">Col</span>&gt;</span></span><br><span class="language-xml">        <span class="hljs-tag">&lt;/<span class="hljs-name">Row</span>&gt;</span></span><br><span class="language-xml">      <span class="hljs-tag">&lt;/<span class="hljs-name">Card</span>&gt;</span></span><br><span class="language-xml">      <span class="hljs-tag">&lt;<span class="hljs-name">EditModal</span></span></span><br><span class="hljs-tag"><span class="language-xml">        <span class="hljs-attr">title</span>=<span class="hljs-string">&#123;modalState.title&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">        <span class="hljs-attr">visible</span>=<span class="hljs-string">&#123;modalState.visible&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">        <span class="hljs-attr">data</span>=<span class="hljs-string">&#123;modalState.data&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">        <span class="hljs-attr">row</span>=<span class="hljs-string">&#123;modalState.row&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">        <span class="hljs-attr">fields</span>=<span class="hljs-string">&#123;loadQuery.data?.fields&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">        <span class="hljs-attr">onOk</span>=<span class="hljs-string">&#123;()</span> =&gt;</span> &#123;</span><br><span class="language-xml">          setModalState(&#123; visible: false &#125;);</span><br><span class="language-xml">          loadQuery.refresh();</span><br><span class="language-xml">        &#125;&#125;</span><br><span class="language-xml">        onCancel=&#123;() =&gt; setModalState(&#123; visible: false &#125;)&#125;</span><br><span class="language-xml">      /&gt;</span><br><span class="language-xml">      &#123;</span><br><span class="language-xml">        selectedRowKeys.length &gt; 0 &amp;&amp; (</span><br><span class="language-xml">          <span class="hljs-tag">&lt;<span class="hljs-name">FooterToolbar</span> <span class="hljs-attr">extra</span>=<span class="hljs-string">&#123;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            &lt;<span class="hljs-attr">Space</span>&gt;</span></span><br><span class="language-xml">              <span class="hljs-tag">&lt;<span class="hljs-name">Button</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">type</span>=<span class="hljs-string">&quot;primary&quot;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                <span class="hljs-attr">onClick</span>=<span class="hljs-string">&#123;()</span> =&gt;</span> deleteRecords(selectedRows)&#125;</span><br><span class="language-xml">              &gt;删除<span class="hljs-tag">&lt;/<span class="hljs-name">Button</span>&gt;</span></span><br><span class="language-xml">            <span class="hljs-tag">&lt;/<span class="hljs-name">Space</span>&gt;</span></span><br><span class="language-xml">          &#125; /&gt;</span><br><span class="language-xml">        )</span><br><span class="language-xml">      &#125;</span><br><span class="language-xml">    <span class="hljs-tag">&lt;/<span class="hljs-name">PageContainer</span>&gt;</span></span><br>  )<br>&#125;<br><span class="hljs-keyword">export</span> <span class="hljs-keyword">default</span> <span class="hljs-title class_">Entity</span><br><br></code></pre></td></tr></table></div></figure>

<h3 id="6-3-EditModal-index-tsx"><a href="#6-3-EditModal-index-tsx" class="headerlink" title="6.3 EditModal\index.tsx"></a>6.3 EditModal\index.tsx</h3><p>src\components\EditModal\index.tsx</p>
<figure class="highlight javascript"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-j0upzmlacl5vp2"></i><span>javascript</span><div class="collapse show" id="collapse-j0upzmlacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br></pre></td><td class="code"><pre><code class="hljs javascript"><span class="hljs-keyword">import</span> &#123; message, <span class="hljs-title class_">Modal</span> &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;antd&#x27;</span><br><span class="hljs-keyword">import</span> &#123; createForm &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@formily/core&#x27;</span><br><span class="hljs-keyword">import</span> &#123; <span class="hljs-title class_">FormProvider</span> &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@formily/react&#x27;</span><br><span class="hljs-keyword">import</span> &#123; request, useRequest &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;umi&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; renderFormFields &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@/utils/render/field&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; useEffect &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;react&#x27;</span>;<br><span class="hljs-keyword">const</span> form = <span class="hljs-title function_">createForm</span>(&#123;<br>    <span class="hljs-attr">validateFirst</span>: <span class="hljs-literal">true</span>,<br>&#125;)<br><span class="hljs-keyword">export</span> <span class="hljs-keyword">default</span> <span class="hljs-keyword">function</span> (<span class="hljs-params">&#123; title, visible, onOk, onCancel, row, data = [], fields = [] &#125;</span>) &#123;<br>    <span class="hljs-keyword">const</span> <span class="hljs-attr">options</span>: any = data.<span class="hljs-title function_">reduce</span>(<span class="hljs-function">(<span class="hljs-params">memo, item</span>) =&gt;</span> &#123;<br>        <span class="hljs-keyword">let</span> value = item.<span class="hljs-property">value</span>;<br>        <span class="hljs-keyword">if</span> (<span class="hljs-title class_">Object</span>.<span class="hljs-title function_">keys</span>(row).<span class="hljs-property">length</span> &gt; <span class="hljs-number">0</span> &amp;&amp; item.<span class="hljs-property">name</span> === <span class="hljs-string">&#x27;url&#x27;</span>) &#123;<br>            value = value.<span class="hljs-title function_">replace</span>(<span class="hljs-regexp">/:([^/]+)/g</span>, <span class="hljs-function">(<span class="hljs-params">match, key</span>) =&gt;</span> row[key]);<br>        &#125;<br>        memo[item.<span class="hljs-property">name</span>] = value;<br>        <span class="hljs-keyword">return</span> memo<br>    &#125;, &#123;&#125;);<br>    <span class="hljs-keyword">const</span> actionQuery = <span class="hljs-title function_">useRequest</span>(<span class="hljs-function">(<span class="hljs-params">&#123; method, url, data &#125;</span>) =&gt;</span> <span class="hljs-title function_">request</span>(url, &#123; method, data &#125;),<br>        &#123;<br>            <span class="hljs-attr">manual</span>: <span class="hljs-literal">true</span>,<br>            <span class="hljs-title function_">onSuccess</span>(<span class="hljs-params">data</span>) &#123;<br>                message.<span class="hljs-title function_">success</span>(data.<span class="hljs-property">message</span>);<br>                <span class="hljs-title function_">onOk</span>();<br>            &#125;,<br>            <span class="hljs-title function_">formatResult</span>(<span class="hljs-params">res</span>) &#123;<br>                <span class="hljs-keyword">return</span> res;<br>            &#125;<br>        &#125;);<br>    <span class="hljs-title function_">useEffect</span>(<span class="hljs-function">() =&gt;</span> &#123;<br>        <span class="hljs-keyword">if</span> (visible &amp;&amp; row) &#123;<br>            form.<span class="hljs-title function_">setValues</span>(row);<br>        &#125;<br>    &#125;);<br>    <span class="hljs-keyword">return</span> (<br>        <span class="language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">Modal</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">title</span>=<span class="hljs-string">&#123;title&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">visible</span>=<span class="hljs-string">&#123;visible&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">            <span class="hljs-attr">onOk</span>=<span class="hljs-string">&#123;()</span> =&gt;</span> &#123;</span><br><span class="language-xml">                actionQuery.run(&#123; url: options.url, method: options.method, data: form.values &#125;);</span><br><span class="language-xml">            &#125;&#125;</span><br><span class="language-xml">            onCancel=&#123;onCancel&#125;</span><br><span class="language-xml">            destroyOnClose</span><br><span class="language-xml">            maskClosable=&#123;false&#125;</span><br><span class="language-xml">            forceRender</span><br><span class="language-xml">        &gt;</span><br><span class="language-xml">            <span class="hljs-tag">&lt;<span class="hljs-name">FormProvider</span> <span class="hljs-attr">form</span>=<span class="hljs-string">&#123;form&#125;</span>&gt;</span></span><br><span class="language-xml">                &#123;renderFormFields(fields)&#125;</span><br><span class="language-xml">            <span class="hljs-tag">&lt;/<span class="hljs-name">FormProvider</span>&gt;</span></span><br><span class="language-xml">        <span class="hljs-tag">&lt;/<span class="hljs-name">Modal</span>&gt;</span></span><br><br>    )<br>&#125;<br><br></code></pre></td></tr></table></div></figure>

<h3 id="6-4-column-tsx"><a href="#6-4-column-tsx" class="headerlink" title="6.4 column.tsx"></a>6.4 column.tsx</h3><p>src\utils\render\column.tsx</p>
<figure class="highlight javascript"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-lxbq3nlacl5vp2"></i><span>javascript</span><div class="collapse show" id="collapse-lxbq3nlacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br></pre></td><td class="code"><pre><code class="hljs javascript"><span class="hljs-keyword">import</span> moment <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;moment&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; <span class="hljs-title class_">Tag</span>, <span class="hljs-title class_">Space</span> &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;antd&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; <span class="hljs-variable constant_">FIELD_TYPES</span> &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;@/constants/enums&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; renderOperations &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;./operation&#x27;</span>;<br><span class="hljs-keyword">const</span> <span class="hljs-title function_">renderColumn</span> = (<span class="hljs-params">column</span>) =&gt; &#123;<br>    <span class="hljs-keyword">switch</span> (column.<span class="hljs-property">type</span>) &#123;<br>        <span class="hljs-keyword">case</span> <span class="hljs-variable constant_">FIELD_TYPES</span>.<span class="hljs-property">datetime</span>:<br>            column.<span class="hljs-property">render</span> = <span class="hljs-function">(<span class="hljs-params">value</span>) =&gt;</span> <span class="hljs-title function_">moment</span>(value).<span class="hljs-title function_">format</span>(<span class="hljs-string">&#x27;YYYY-MM-DD HH:mm:ss&#x27;</span>)<br>            <span class="hljs-keyword">break</span>;<br>        <span class="hljs-keyword">case</span> <span class="hljs-variable constant_">FIELD_TYPES</span>.<span class="hljs-property">switch</span>:<br>            column.<span class="hljs-property">render</span> = <span class="hljs-function">(<span class="hljs-params">value</span>) =&gt;</span> &#123;<br>                <span class="hljs-keyword">const</span> &#123; title &#125; = column.<span class="hljs-property">data</span>.<span class="hljs-title function_">find</span>(<span class="hljs-function"><span class="hljs-params">item</span> =&gt;</span> item.<span class="hljs-property">value</span> === value);<br>                <span class="hljs-keyword">return</span> <span class="language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">Tag</span> <span class="hljs-attr">color</span>=<span class="hljs-string">&#123;value</span> ? &#x27;<span class="hljs-attr">green</span>&#x27; <span class="hljs-attr">:</span> &#x27;<span class="hljs-attr">red</span>&#x27;&#125;&gt;</span> &#123;title&#125; <span class="hljs-tag">&lt;/<span class="hljs-name">Tag</span>&gt;</span></span><br>            &#125;<br>            <span class="hljs-keyword">break</span>;<br>        <span class="hljs-attr">default</span>:<br>            <span class="hljs-keyword">break</span>;<br>    &#125;<br>&#125;<br><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">function</span> <span class="hljs-title function_">renderColumns</span>(<span class="hljs-params">data, onAction</span>) &#123;<br>    <span class="hljs-keyword">if</span> (data) &#123;<br>        <span class="hljs-keyword">const</span> &#123; fields, record &#125; = data;<br>        <span class="hljs-keyword">return</span> fields<br>            .<span class="hljs-title function_">filter</span>(<span class="hljs-function"><span class="hljs-params">field</span> =&gt;</span> !field.<span class="hljs-property">hideInColumn</span>)<br>            .<span class="hljs-title function_">map</span>(<span class="hljs-function"><span class="hljs-params">field</span> =&gt;</span> &#123;<br>                <span class="hljs-keyword">const</span> column = &#123; ...field &#125;;<br>                column.<span class="hljs-property">key</span> = column.<span class="hljs-property">dataIndex</span> = field.<span class="hljs-property">name</span>;<br>                <span class="hljs-title function_">renderColumn</span>(column);<br>                <span class="hljs-keyword">return</span> column;<br>            &#125;).<span class="hljs-title function_">concat</span>(&#123;<br>                <span class="hljs-attr">title</span>: <span class="hljs-string">&#x27;操作&#x27;</span>, <span class="hljs-attr">dataIndex</span>: <span class="hljs-string">&#x27;operations&#x27;</span>, <span class="hljs-attr">key</span>: <span class="hljs-string">&#x27;operations&#x27;</span>, <span class="hljs-attr">render</span>: <span class="hljs-function">(<span class="hljs-params">_, row</span>) =&gt;</span> (<br>                    <span class="language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">Space</span>&gt;</span></span><br><span class="language-xml">                        &#123;renderOperations(record, onAction, row)&#125;</span><br><span class="language-xml">                    <span class="hljs-tag">&lt;/<span class="hljs-name">Space</span>&gt;</span></span><br>                )<br>            &#125;);<br>    &#125;<br>    <span class="hljs-keyword">return</span> [];<br>&#125;<br><br></code></pre></td></tr></table></div></figure>

<h3 id="6-5-field-tsx"><a href="#6-5-field-tsx" class="headerlink" title="6.5 field.tsx"></a>6.5 field.tsx</h3><p>src\utils\render\field.tsx</p>
<figure class="highlight dart"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-lmw98llacl5vp2"></i><span>dart</span><div class="collapse show" id="collapse-lmw98llacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br><span class="line">75</span><br><span class="line">76</span><br><span class="line">77</span><br><span class="line">78</span><br><span class="line">79</span><br><span class="line">80</span><br><span class="line">81</span><br><span class="line">82</span><br><span class="line">83</span><br><span class="line">84</span><br><span class="line">85</span><br><span class="line">86</span><br><span class="line">87</span><br><span class="line">88</span><br><span class="line">89</span><br><span class="line">90</span><br><span class="line">91</span><br><span class="line">92</span><br><span class="line">93</span><br><span class="line">94</span><br><span class="line">95</span><br><span class="line">96</span><br><span class="line">97</span><br><span class="line">98</span><br><span class="line">99</span><br><span class="line">100</span><br><span class="line">101</span><br><span class="line">102</span><br><span class="line">103</span><br><span class="line">104</span><br><span class="line">105</span><br><span class="line">106</span><br><span class="line">107</span><br><span class="line">108</span><br><span class="line">109</span><br><span class="line">110</span><br><span class="line">111</span><br><span class="line">112</span><br><span class="line">113</span><br><span class="line">114</span><br><span class="line">115</span><br><span class="line">116</span><br><span class="line">117</span><br><span class="line">118</span><br><span class="line">119</span><br><span class="line">120</span><br><span class="line">121</span><br><span class="line">122</span><br><span class="line">123</span><br><span class="line">124</span><br><span class="line">125</span><br><span class="line">126</span><br><span class="line">127</span><br><span class="line">128</span><br><span class="line">129</span><br><span class="line">130</span><br><span class="line">131</span><br><span class="line">132</span><br><span class="line">133</span><br><span class="line">134</span><br></pre></td><td class="code"><pre><code class="hljs dart"><span class="hljs-keyword">import</span> &#123; FIELD_TYPES &#125; from <span class="hljs-string">&#x27;@/constants/enums&#x27;</span>;<br><span class="hljs-keyword">import</span> moment from <span class="hljs-string">&#x27;moment&#x27;</span>;<br><span class="hljs-keyword">import</span> &#123; Card, InputNumber &#125; from <span class="hljs-string">&#x27;antd&#x27;</span><br><span class="hljs-keyword">import</span> &#123;<br>    FormItem, Input, ArrayTable, Editable, Select, Checkbox, Switch,<br>    FormLayout, FormGrid<br>&#125; from <span class="hljs-string">&#x27;@formily/antd&#x27;</span><br><span class="hljs-keyword">import</span> &#123; createSchemaField &#125; from <span class="hljs-string">&#x27;@formily/react&#x27;</span><br><span class="hljs-keyword">const</span> SchemaField = createSchemaField(&#123;<br>    components: &#123;<br>        FormItem,<br>        Editable,<br>        Input,<br>        ArrayTable,<br>        Select,<br>        Checkbox,<br>        Switch,<br>        FormLayout,<br>        Card,<br>        FormGrid,<br>        InputNumber<br>    &#125;,<br>&#125;)<br><span class="hljs-keyword">export</span> <span class="hljs-keyword">const</span> renderFormFields = (fields = []) =&gt; &#123;<br>    <span class="hljs-keyword">return</span> (<br>        &lt;SchemaField&gt;<br>            &#123;<br>                fields.map(field =&gt; &#123;<br>                    <span class="hljs-keyword">switch</span> (field.type) &#123;<br>                        <span class="hljs-keyword">case</span> FIELD_TYPES.datetime:<br>                            <span class="hljs-keyword">return</span> (<br>                                &lt;SchemaField.<span class="hljs-built_in">String</span><br>                                    name=&#123;field.name&#125;<br>                                    title=&#123;field.title&#125;<br>                                    x-decorator=<span class="hljs-string">&quot;FormItem&quot;</span><br>                                    <span class="hljs-keyword">required</span><br>                                    x-component=<span class="hljs-string">&quot;DatePicker&quot;</span><br>                                    x-component-props=&#123;&#123; showTime: <span class="hljs-keyword">true</span> &#125;&#125;<br>                                /&gt;<br>                            )<br>                        <span class="hljs-keyword">case</span> FIELD_TYPES.<span class="hljs-keyword">switch</span>:<br>                            <span class="hljs-keyword">return</span> (<br>                                &lt;SchemaField.<span class="hljs-built_in">String</span><br>                                    name=&#123;field.name&#125;<br>                                    title=&#123;field.title&#125;<br>                                    x-decorator=<span class="hljs-string">&quot;FormItem&quot;</span><br>                                    <span class="hljs-keyword">required</span><br>                                    x-component=<span class="hljs-string">&quot;Switch&quot;</span><br>                                /&gt;<br>                            )<br>                        <span class="hljs-keyword">case</span> FIELD_TYPES.number:<br>                            <span class="hljs-keyword">return</span> (<br>                                &lt;SchemaField.<span class="hljs-built_in">String</span><br>                                    name=&#123;field.name&#125;<br>                                    title=&#123;field.title&#125;<br>                                    x-decorator=<span class="hljs-string">&quot;FormItem&quot;</span><br>                                    <span class="hljs-keyword">required</span><br>                                    x-component=<span class="hljs-string">&quot;InputNumber&quot;</span><br>                                /&gt;<br>                            );<br>                        <span class="hljs-keyword">default</span>:<br>                            <span class="hljs-keyword">return</span> (<br>                                &lt;SchemaField.<span class="hljs-built_in">String</span><br>                                    name=&#123;field.name&#125;<br>                                    title=&#123;field.title&#125;<br>                                    x-decorator=<span class="hljs-string">&quot;FormItem&quot;</span><br>                                    <span class="hljs-keyword">required</span><br>                                    x-component=<span class="hljs-string">&quot;Input&quot;</span><br>                                /&gt;<br>                            )<br>                    &#125;<br>                &#125;)<br>            &#125;<br>        &lt;/SchemaField&gt;<br>    )<br>&#125;<br><br><span class="hljs-keyword">export</span> <span class="hljs-keyword">const</span> renderSearchFields = (fields = []) =&gt; &#123;<br>    <span class="hljs-keyword">return</span> (<br>        &lt;SchemaField&gt;<br>            &lt;SchemaField.Void<br>                x-component=<span class="hljs-string">&quot;FormGrid&quot;</span><br>                x-component-props=&#123;&#123;<br>                    maxColumns: <span class="hljs-number">4</span>,<br>                    minColumns: <span class="hljs-number">2</span>,<br>                &#125;&#125;<br>            &gt;<br>                &#123;<br>                    fields.map(field =&gt; &#123;<br>                        <span class="hljs-keyword">switch</span> (field.type) &#123;<br>                            <span class="hljs-keyword">case</span> <span class="hljs-string">&#x27;number&#x27;</span>:<br>                                <span class="hljs-keyword">return</span> (<br>                                    &lt;SchemaField.<span class="hljs-built_in">String</span><br>                                        name=&#123;field.name&#125;<br>                                        title=&#123;field.title&#125;<br>                                        x-decorator=<span class="hljs-string">&quot;FormItem&quot;</span><br>                                        x-component=<span class="hljs-string">&quot;InputNumber&quot;</span><br>                                    /&gt;<br>                                )<br>                            <span class="hljs-keyword">case</span> <span class="hljs-string">&#x27;datetime&#x27;</span>:<br>                                <span class="hljs-keyword">return</span> (<br>                                    &lt;SchemaField.<span class="hljs-built_in">String</span><br>                                        name=&#123;field.name&#125;<br>                                        title=&#123;field.title&#125;<br>                                        x-decorator=<span class="hljs-string">&quot;FormItem&quot;</span><br>                                        x-decorator-props=&#123;&#123; gridSpan: <span class="hljs-number">2</span> &#125;&#125;<br>                                        x-component=<span class="hljs-string">&quot;DatePicker.RangePicker&quot;</span><br>                                        x-component-props=&#123;&#123;<br>                                            showTime: <span class="hljs-keyword">true</span>, ranges: &#123;<br>                                                <span class="hljs-string">&#x27;今天&#x27;</span>: [moment().startOf(<span class="hljs-string">&#x27;day&#x27;</span>), moment()],<br>                                                <span class="hljs-string">&#x27;本月&#x27;</span>: [moment().startOf(<span class="hljs-string">&#x27;month&#x27;</span>), moment().endOf(<span class="hljs-string">&#x27;month&#x27;</span>)],<br>                                                <span class="hljs-string">&#x27;上周&#x27;</span>: [moment().subtract(<span class="hljs-number">7</span>, <span class="hljs-string">&#x27;days&#x27;</span>), moment()],<br>                                                <span class="hljs-string">&#x27;上月&#x27;</span>: [moment().subtract(<span class="hljs-number">1</span>, <span class="hljs-string">&#x27;months&#x27;</span>).startOf(<span class="hljs-string">&#x27;month&#x27;</span>), moment().subtract(<span class="hljs-number">1</span>, <span class="hljs-string">&#x27;months&#x27;</span>).endOf(<span class="hljs-string">&#x27;month&#x27;</span>)]<br>                                            &#125;<br>                                        &#125;&#125;<br>                                    /&gt;<br>                                )<br>                            <span class="hljs-keyword">default</span>:<br>                                <span class="hljs-keyword">return</span> (<br>                                    &lt;SchemaField.<span class="hljs-built_in">String</span><br>                                        name=&#123;field.name&#125;<br>                                        title=&#123;field.title&#125;<br>                                        x-decorator=<span class="hljs-string">&quot;FormItem&quot;</span><br>                                        x-component=<span class="hljs-string">&quot;Input&quot;</span><br>                                    /&gt;<br>                                )<br>                        &#125;<br>                    &#125;)<br>                &#125;<br>            &lt;/SchemaField.Void&gt;<br>        &lt;/SchemaField&gt;<br>    )<br>&#125;<br><br></code></pre></td></tr></table></div></figure>

<h3 id="6-6-operation-tsx"><a href="#6-6-operation-tsx" class="headerlink" title="6.6 operation.tsx"></a>6.6 operation.tsx</h3><p>src\utils\render\operation.tsx</p>
<figure class="highlight javascript"><i class="iconfont icon-top" type="button" data-toggle="collapse" data-target="#collapse-yel8h3lacl5vp2"></i><span>javascript</span><div class="collapse show" id="collapse-yel8h3lacl5vp2"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br></pre></td><td class="code"><pre><code class="hljs javascript"><span class="hljs-keyword">import</span> &#123; <span class="hljs-title class_">Space</span>, <span class="hljs-title class_">Button</span> &#125; <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;antd&#x27;</span>;<br><span class="hljs-keyword">export</span> <span class="hljs-keyword">const</span> <span class="hljs-title function_">renderOperations</span> = (<span class="hljs-params">record = [], onAction, row = &#123;&#125;</span>) =&gt; &#123;<br>    <span class="hljs-keyword">return</span> (<br>        <span class="language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">Space</span>&gt;</span></span><br><span class="language-xml">            &#123;</span><br><span class="language-xml">                record.map(operation =&gt; (</span><br><span class="language-xml">                    <span class="hljs-tag">&lt;<span class="hljs-name">Button</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">key</span>=<span class="hljs-string">&#123;operation.title&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">type</span>=<span class="hljs-string">&#123;operation.type&#125;</span></span></span><br><span class="hljs-tag"><span class="language-xml">                        <span class="hljs-attr">onClick</span>=<span class="hljs-string">&#123;()</span> =&gt;</span> onAction(operation, row)&#125;</span><br><span class="language-xml">                    &gt;&#123;operation.title&#125;<span class="hljs-tag">&lt;/<span class="hljs-name">Button</span>&gt;</span></span><br><span class="language-xml">                ))</span><br><span class="language-xml">            &#125;</span><br><span class="language-xml">        <span class="hljs-tag">&lt;/<span class="hljs-name">Space</span>&gt;</span></span><br>    )<br>&#125;<br><br></code></pre></td></tr></table></div></figure>

<h2 id="参考"><a href="#参考" class="headerlink" title="参考 "></a>参考 </h2><ul>
<li>  <a target="_blank" rel="noopener" href="https://next.umijs.org/docs/api/runtime-config#getinitialstate">运行时配置</a></li>
</ul>

                
              </div>
            
            <hr/>
            <div>
              <div class="post-metas my-3">
  
    <div class="post-meta mr-3 d-flex align-items-center">
      <i class="iconfont icon-category"></i>
      

<span class="category-chains">
  
  
    
      <span class="category-chain">
        
  <a href="/categories/%E7%BB%84%E4%BB%B6%E5%BA%93/" class="category-chain-item">组件库</a>
  
  
    <span>></span>
    
  <a href="/categories/%E7%BB%84%E4%BB%B6%E5%BA%93/formily/" class="category-chain-item">formily</a>
  
  

  

      </span>
    
  
</span>

    </div>
  
  
    <div class="post-meta">
      <i class="iconfont icon-tags"></i>
      
        <a href="/tags/%E7%BB%84%E4%BB%B6%E5%BA%93/">#组件库</a>
      
        <a href="/tags/formily/">#formily</a>
      
    </div>
  
</div>


              
  

  <div class="license-box my-3">
    <div class="license-title">
      <div>umi4+formily</div>
      <div>http://81.68.132.127/2022/11/11/formily/umi4+formily/</div>
    </div>
    <div class="license-meta">
      
        <div class="license-meta-item">
          <div>作者</div>
          <div>Ikki</div>
        </div>
      
      
        <div class="license-meta-item license-meta-date">
          <div>发布于</div>
          <div>2022年11月11日</div>
        </div>
      
      
        <div class="license-meta-item license-meta-date">
          <div>更新于</div>
          <div>2022年11月11日</div>
        </div>
      
      
        <div class="license-meta-item">
          <div>许可协议</div>
          <div>
            
              
              
                <a target="_blank" href="https://creativecommons.org/licenses/by/4.0/">
                  <span class="hint--top hint--rounded" aria-label="BY - 署名">
                    <i class="iconfont icon-by"></i>
                  </span>
                </a>
              
            
          </div>
        </div>
      
    </div>
    <div class="license-icon iconfont"></div>
  </div>



              
                <div class="post-prevnext my-3">
                  <article class="post-prev col-6">
                    
                    
                      <a href="/2022/11/11/formily/formily%E7%AE%80%E7%89%88%E6%BA%90%E7%A0%81/" title="formily简版源码">
                        <i class="iconfont icon-arrowleft"></i>
                        <span class="hidden-mobile">formily简版源码</span>
                        <span class="visible-mobile">上一篇</span>
                      </a>
                    
                  </article>
                  <article class="post-next col-6">
                    
                    
                      <a href="/2022/11/11/formily/formily%E5%9F%BA%E7%A1%80/" title="formily基础">
                        <span class="hidden-mobile">formily基础</span>
                        <span class="visible-mobile">下一篇</span>
                        <i class="iconfont icon-arrowright"></i>
                      </a>
                    
                  </article>
                </div>
              
            </div>

            
  <article id="comments" lazyload>
    
  <div id="valine"></div>
  <script type="text/javascript">
    Fluid.utils.loadComments('#valine', function() {
      Fluid.utils.createScript('https://lib.baomitu.com/valine/1.5.1/Valine.min.js', function() {
        var options = Object.assign(
          {"appId":"6KzYWc2oaEBaHgNl4UIicMJC-gzGzoHsz","appKey":"vJ4FIwKeHRmHraCJraAsjyZ7","path":"window.location.pathname","placeholder":"请输入你的评论\n昵称为必填项目(输入QQ号码可以自动获取昵称和邮箱)\n虽然email不是必选，但是填写了email可以收到推送通知哦！","avatar":"retro","meta":["nick","mail","link"],"requiredFields":[],"pageSize":10,"lang":"zh-CN","highlight":true,"recordIP":true,"serverURLs":"","emojiCDN":null,"emojiMaps":null,"enableQQ":true},
          {
            el: "#valine",
            path: window.location.pathname
          }
        )
        new Valine(options);
        Fluid.utils.waitElementVisible('#valine .vcontent', () => {
          var imgSelector = '#valine .vcontent img:not(.vemoji)';
          Fluid.plugins.imageCaption(imgSelector);
          Fluid.plugins.fancyBox(imgSelector);
        })
      });
    });
  </script>
  <noscript>Please enable JavaScript to view the comments</noscript>


  </article>


          </article>
        </div>
      </div>
    </div>

    <div class="side-col d-none d-lg-block col-lg-2">
      

    </div>
  </div>
</div>





  



  



  



  



  







    

    
      <a id="scroll-top-button" aria-label="TOP" href="#" role="button">
        <i class="iconfont icon-arrowup" aria-hidden="true"></i>
      </a>
    

    
      <div class="modal fade" id="modalSearch" tabindex="-1" role="dialog" aria-labelledby="ModalLabel"
     aria-hidden="true">
  <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header text-center">
        <h4 class="modal-title w-100 font-weight-bold">搜索</h4>
        <button type="button" id="local-search-close" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body mx-3">
        <div class="md-form mb-5">
          <input type="text" id="local-search-input" class="form-control validate">
          <label data-error="x" data-success="v" for="local-search-input">关键词</label>
        </div>
        <div class="list-group" id="local-search-result"></div>
      </div>
    </div>
  </div>
</div>

    

    
  </main>

  <footer>
    <div class="footer-inner">
  
    <div class="footer-content">
      IKKI-专业BUG开发
    </div>
  
  
    <div class="statistics">
  
  

  
    
      <span id="busuanzi_container_site_pv" style="display: none">
        总访问量 
        <span id="busuanzi_value_site_pv"></span>
         次
      </span>
    
    
      <span id="busuanzi_container_site_uv" style="display: none">
        总访客数 
        <span id="busuanzi_value_site_uv"></span>
         人
      </span>
    
    
  
</div>

  
  
  
</div>

  </footer>

  <!-- Scripts -->
  
  <script  src="https://lib.baomitu.com/nprogress/0.2.0/nprogress.min.js" ></script>
  <link  rel="stylesheet" href="https://lib.baomitu.com/nprogress/0.2.0/nprogress.min.css" />

  <script>
    NProgress.configure({"showSpinner":false,"trickleSpeed":100})
    NProgress.start()
    window.addEventListener('load', function() {
      NProgress.done();
    })
  </script>


<script  src="https://lib.baomitu.com/jquery/3.6.0/jquery.min.js" ></script>
<script  src="https://lib.baomitu.com/twitter-bootstrap/4.6.1/js/bootstrap.min.js" ></script>
<script  src="/js/events.js" ></script>
<script  src="/js/plugins.js" ></script>


  <script  src="https://lib.baomitu.com/typed.js/2.0.12/typed.min.js" ></script>
  <script>
    (function (window, document) {
      var typing = Fluid.plugins.typing;
      var subtitle = document.getElementById('subtitle');
      if (!subtitle || !typing) {
        return;
      }
      var text = subtitle.getAttribute('data-typed-text');
      
        typing(text);
      
    })(window, document);
  </script>




  
    <script  src="/js/img-lazyload.js" ></script>
  




  
<script>
  Fluid.utils.createScript('https://lib.baomitu.com/tocbot/4.18.2/tocbot.min.js', function() {
    var toc = jQuery('#toc');
    if (toc.length === 0 || !window.tocbot) { return; }
    var boardCtn = jQuery('#board-ctn');
    var boardTop = boardCtn.offset().top;

    window.tocbot.init(Object.assign({
      tocSelector     : '#toc-body',
      contentSelector : '.markdown-body',
      linkClass       : 'tocbot-link',
      activeLinkClass : 'tocbot-active-link',
      listClass       : 'tocbot-list',
      isCollapsedClass: 'tocbot-is-collapsed',
      collapsibleClass: 'tocbot-is-collapsible',
      scrollSmooth    : true,
      includeTitleTags: true,
      headingsOffset  : -boardTop,
    }, CONFIG.toc));
    if (toc.find('.toc-list-item').length > 0) {
      toc.css('visibility', 'visible');
    }

    Fluid.events.registerRefreshCallback(function() {
      if ('tocbot' in window) {
        tocbot.refresh();
        var toc = jQuery('#toc');
        if (toc.length === 0 || !tocbot) {
          return;
        }
        if (toc.find('.toc-list-item').length > 0) {
          toc.css('visibility', 'visible');
        }
      }
    });
  });
</script>


  <script src=https://lib.baomitu.com/clipboard.js/2.0.11/clipboard.min.js></script>

  <script>Fluid.plugins.codeWidget();</script>


  
<script>
  Fluid.utils.createScript('https://lib.baomitu.com/anchor-js/4.3.1/anchor.min.js', function() {
    window.anchors.options = {
      placement: CONFIG.anchorjs.placement,
      visible  : CONFIG.anchorjs.visible
    };
    if (CONFIG.anchorjs.icon) {
      window.anchors.options.icon = CONFIG.anchorjs.icon;
    }
    var el = (CONFIG.anchorjs.element || 'h1,h2,h3,h4,h5,h6').split(',');
    var res = [];
    for (var item of el) {
      res.push('.markdown-body > ' + item.trim());
    }
    if (CONFIG.anchorjs.placement === 'left') {
      window.anchors.options.class = 'anchorjs-link-left';
    }
    window.anchors.add(res.join(', '));

    Fluid.events.registerRefreshCallback(function() {
      if ('anchors' in window) {
        anchors.removeAll();
        var el = (CONFIG.anchorjs.element || 'h1,h2,h3,h4,h5,h6').split(',');
        var res = [];
        for (var item of el) {
          res.push('.markdown-body > ' + item.trim());
        }
        if (CONFIG.anchorjs.placement === 'left') {
          anchors.options.class = 'anchorjs-link-left';
        }
        anchors.add(res.join(', '));
      }
    });
  });
</script>


  
<script>
  Fluid.utils.createScript('https://lib.baomitu.com/fancybox/3.5.7/jquery.fancybox.min.js', function() {
    Fluid.plugins.fancyBox();
  });
</script>


  <script>Fluid.plugins.imageCaption();</script>

  <script  src="/js/local-search.js" ></script>

  <script defer src="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js" ></script>




  
<script src="/fluid/js/star.js"></script>



<!-- 主题的启动项，将它保持在最底部 -->
<!-- the boot of the theme, keep it at the bottom -->
<script  src="/js/boot.js" ></script>


  

  <noscript>
    <div class="noscript-warning">博客在允许 JavaScript 运行的环境下浏览效果更佳</div>
  </noscript>
</body>
</html>
